Heim > Web-Frontend > js-Tutorial > Hauptteil

Verwenden Sie JS, um Fensterelemente mit fester Position beim Scrollen der Seite anzuzeigen/auszublenden

不言
Freigeben: 2018-06-25 10:23:07
Original
2126 Leute haben es durchsucht

Das Element wird an einer festen Position im Fenster angezeigt und die Seite wird nach unten gescrollt, wenn die Seitenposition kleiner als eine bestimmte Höhe ist Wenn das Element nach oben gescrollt wird, wird es Ihnen unten vorgestellt. JS realisiert das Anzeigen/Ausblenden des Fensterelements mit fester Position beim Scrollen Wenn die Seitenhöhe größer als eine bestimmte Höhe ist und die Seite nach unten scrollt, wird das Element angezeigt, wenn die Seitenposition kleiner als eine bestimmte Höhe ist oder wenn die Seite nach oben scrollt.

Lassen Sie mich Ihnen zuerst die Renderings zeigen:

1.html


<p id="selected-case-count"><span class=&#39;form-control&#39;>已选: <span class="casecount">0</span></span></p>
Nach dem Login kopieren

2.css


p#selected-case-count{
position:fixed; /*固定元素位置*/
top:2px; /*距顶端举例*/
right:40px; /*距右侧位置*/
color:red; 
}
Nach dem Login kopieren

3.js

rrree

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Lernen aller hilfreich sein. Bitte achten Sie auf PHP Chinesische Website!

Verwandte Empfehlungen:

So verwenden Sie Vue2, um eine dreistufige Verknüpfung zu erreichen


So verwenden Sie einfach verknüpfte Listen und Zirkuläre verknüpfte Listen in JavaScript


So lösen Sie das Problem der Pulldown-Aktualisierung oben im mobilen Browser


Das obige ist der detaillierte Inhalt vonVerwenden Sie JS, um Fensterelemente mit fester Position beim Scrollen der Seite anzuzeigen/auszublenden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!