Stop feste div auf bestimmten DIV

Question

Ich habe diesen Code, um meine Sidebar beim Scrollen nach unten geklebt. Dadurch kann die Seitenleiste jedoch bis zum Ende der Seite verschoben werden, wodurch andere Elemente auf der Site überlappen.

$(function() { 
 
    var counter = 0; 
 
    var s = $("#counter"); 
 
    var pos = s.position(); 
 
    $(window).scroll(function() { 
 
     var windowpos = $(window).scrollTop(); 
 
     if (windowpos >= pos.top) { 
 
      s.addClass("stick"); 
 
     } else { 
 
      s.removeClass("stick"); 
 
     } 
 
    }); 
 

 
});

<div id="sidebar"> \t 
 
    <div id="counter"> 
 
    * php dynamic_sidebar('Sidebar'); * 
 
    <div class="clear"></div> 
 
    </div> \t \t 
 
</div>

ich jetzt eine Stunde lang gesucht haben, ohne eine Lösung zu finden. Ich möchte, dass die Seitenleiste aufhört, geklebt zu werden, wenn die Schriftrolle die div Fußzeile erreicht.

Answer 1

Sie müssen CSS verwenden, um dieses Problem anzugehen. Fügen Sie einfach Padding von unten gleich der Höhe des Elements am unteren Rand hinzu.

Angenommen, Sie haben eine Fußzeile mit der Höhe 50px. Fügen Sie dann padding-bottom: 50px zur Seitenleiste hinzu und geben Sie Fußzeile einige Z-Index auch wie Z-Index: 9 oder Z-Index: 99.

Lassen Sie mich wissen, ob dies hilft.

Danke