Heim  >  Artikel  >  Web-Frontend  >  Zusammenfassung der js/jQ-Methoden zum Erzielen von Bildlaufleisteneffekten

Zusammenfassung der js/jQ-Methoden zum Erzielen von Bildlaufleisteneffekten

巴扎黑
巴扎黑Original
2017-06-07 11:44:241966Durchsuche

Vorher gab es einen Artikel „Zusammenfassung der Einstellungen im Zusammenhang mit Bildlaufleisten auf HTML-Seiten“ , in dem es hauptsächlich darum ging, wie man den Stil, die Farbe usw. der Bildlaufleiste über CSS festlegt. Heute werde ich zusammenfassen So richten Sie es über die JS/JQ-Bildlaufleiste ein:

1.Ein Beispiel für die Verwendung von jQuery, um den Effekt des Hinzufügens einer dreidimensionalen digitalen Bildlaufleiste zu realisierenEin Teil davon ist ein HTML Struktur und der andere Teil ist ein js-Codesegment. Freunde in Not können darauf verweisen!

Zusammenfassung der js/jQ-Methoden zum Erzielen von Bildlaufleisteneffekten2.

js implementiert eine einfache vertikale Bildlaufleiste

In diesem Artikel wird hauptsächlich der Beispielcode von js vorgestellt, der einen einfachen vertikalen Bildlauf implementiert Leiste, mit sehr gutem Referenzwert, werfen wir einen Blick mit dem Editor unten

Zusammenfassung der js/jQ-Methoden zum Erzielen von Bildlaufleisteneffekten3.

Code-Case-Sharing der nativen JS-Kapselung benutzerdefinierter Bildlaufleisten

In diesem Artikel werden hauptsächlich die relevanten Kenntnisse der nativen JS-Kapselung benutzerdefinierter Bildlaufleisten vorgestellt. Hat einen sehr guten Referenzwert. Werfen wir einen Blick darauf mit dem Editor unten

Kürzlich gab es ein Projekt zur Erstellung eines Online-Musikplayers, der die Verwendung einer Bildlaufleiste erforderte, aber die integrierte Bildlaufleiste war zu hässlich, also habe ich Ich habe selbst darüber nachgedacht.

Zusammenfassung der js/jQ-Methoden zum Erzielen von Bildlaufleisteneffekten4.

Verwenden Sie JQuery, um das Scrollen der äußeren Bildlaufleiste zu verhindern

Normalerweise, wenn die innere Bildlaufleiste zu beiden scrollt endet Beim Scrollen scrollt die äußere Bildlaufleiste mit; manchmal hoffen wir jedoch, dass der Benutzer nur durch den aktuellen Bereich scrollen kann, ohne die äußere (Fenster-)Bildlaufleiste auszulösen. Streifen. Denn der Benutzer könnte versehentlich zu weit scrollen, wodurch der aktuelle Bereich den sichtbaren Bereich verlässt.

Zusammenfassung der js/jQ-Methoden zum Erzielen von Bildlaufleisteneffekten5.

Jquery-Methode, um festzustellen, ob die Bildlaufleiste unten oder oben angekommen ist

Um an die Spitze zu gelangen , einfach abrufen Wenn scrollTop()==0, ist es die Oberseite;
$(document).height()  //是获取整个页面的高度
$(window).height()  //是获取当前也就是浏览器所能看到的页面的那部分的高度。这个大小在你缩放浏览器窗口大小时会改变,与document是不一样的

Um die Unterseite zu erhalten, rufen Sie einfach scrollTop()>=$(document).height()-$(window).height ab () Beachten Sie, dass Sie nach unten gescrollt haben

Das obige ist der detaillierte Inhalt vonZusammenfassung der js/jQ-Methoden zum Erzielen von Bildlaufleisteneffekten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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