Heim > Web-Frontend > js-Tutorial > Jquery implementiert die Seitenleiste, die der Bildlaufleiste folgt (kompatibel mit IE6)_jquery

Jquery implementiert die Seitenleiste, die der Bildlaufleiste folgt (kompatibel mit IE6)_jquery

WBOY
Freigeben: 2016-05-16 16:53:46
Original
1357 Leute haben es durchsucht

Einige Shopping-Websites verwenden diese Funktion, um die Navigation im Warenkorb oder in der Produktkategorie zu platzieren, sodass die Seitenleiste immer die ihr gebührende Rolle spielen kann, wenn die Produktseite sehr lang ist. Einige Websites verwenden diese Funktion, um Anzeigen in der Seitenleiste zu platzieren.

jQuery-Code:

Code kopieren Der Code lautet wie folgt:

var rollSet = $('#Roll');// Überprüfen Sie das Objekt, #sidebar-tab ist die ID, die mit der Bildlaufleiste festgelegt werden soll, die bei Bedarf geändert werden kann
var offset = rollSet.offset ();
$( window).scroll(function () {
// Überprüfen Sie, ob die Oberseite des Objekts im sichtbaren Bereich des Browsers liegt
var scrollTop = $(window).scrollTop( );
if(offset.top < ; scrollTop){
rollSet.addClass('fixed');
}else{
rollSet.removeClass('fixed');
}
});

CSS-Code:
Code kopieren Der Code ist wie folgt folgt:

.fixed{ position:fixed; top:20px;}
.fixed{_position:absolute; _top:expression((20 (noValue = document.documentElement.scrollTop ? document. documentElement.scrollTop : document.body.scrollTop)) 'px' );}//Kompatibel mit IE6
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage