Hallo,
Sorry für den Titel, irgendwie fällt mir nichts anderes ein.
Also, es geht darum, dass ich die Sidebar der Seite beim Scrollen fix wird, wenn man das Ende der Sidebar erreicht hat. Scrollt man bis zum Ende der Seite und das untere Ende der Sidebar berührt den Footer, setze ich einen festen Abstand für die Sidebar von unten, damit diese eben nicht über den Footer läuft. Es funktioniert alles soweit, nur wenn die Sidebar den Footer erreicht, zittert diese total, was unschön aussieht. Ab und zu läuft die sogar über den Footer drüber, was mir nicht ganz verständlich ist.
Ich weiß, die Bezeichner sind nicht gerade mega aussagekräftig, aber ich bin gerade noch in der Ausprobierphase. Wenn alles steht und funktioniert, mach ich alles schöner.
Weiß jemand, woran es liegen könnte, dass es zittert und manchmal nicht sehr gut funktioniert?
Danke!!
Nachtrag: setze ich den Wert 1050 px für supplementaryHeight, so funktioniert alles einwandfrei. Das Problem ist dabei, wenn man die Seite verkleinert, oder wahrscheinlich jemand eine andere Auflösung hat etc. funktioniert es nicht mehr so gut, also eben nicht dynamisch.
Sorry für den Titel, irgendwie fällt mir nichts anderes ein.
Also, es geht darum, dass ich die Sidebar der Seite beim Scrollen fix wird, wenn man das Ende der Sidebar erreicht hat. Scrollt man bis zum Ende der Seite und das untere Ende der Sidebar berührt den Footer, setze ich einen festen Abstand für die Sidebar von unten, damit diese eben nicht über den Footer läuft. Es funktioniert alles soweit, nur wenn die Sidebar den Footer erreicht, zittert diese total, was unschön aussieht. Ab und zu läuft die sogar über den Footer drüber, was mir nicht ganz verständlich ist.
Ich weiß, die Bezeichner sind nicht gerade mega aussagekräftig, aber ich bin gerade noch in der Ausprobierphase. Wenn alles steht und funktioniert, mach ich alles schöner.
Code:
$(document).scroll(function() {
var scrollPosition = $(document).scrollTop();
var supplementaryHeight = $('#supMeta').offset().top - $(window).scrollTop();
<!-- supMeta ist ein leerer div am Ende der Sidebar, dient zur Bestimmung des Bottom Punktes der Sidebar-->
var footerTopPos = $('#footer').position().top;
var supplementaryBottom = scrollPosition + supplementaryHeight;
var abstandUnten = $(document).height() - footerTopPos + 5;
if (scrollPosition >= supplementaryHeight) {
$('.meta').addClass('fixed');
<!-- .meta ist die Sidebar selbst--->
if (footerTopPos <= supplementaryBottom){
$('.fixed').css('bottom', abstandUnten + 'px');
}else{
$('.fixed').css('bottom', '5px');
}
} else {
$(".meta").removeClass('fixed');
};
});Weiß jemand, woran es liegen könnte, dass es zittert und manchmal nicht sehr gut funktioniert?
Danke!!
Ergänzung ()
Nachtrag: setze ich den Wert 1050 px für supplementaryHeight, so funktioniert alles einwandfrei. Das Problem ist dabei, wenn man die Seite verkleinert, oder wahrscheinlich jemand eine andere Auflösung hat etc. funktioniert es nicht mehr so gut, also eben nicht dynamisch.
