jQuery elemen tetap plug-in scrolltofixed use guide_jquery

Saya menggunakan pemalam ini suatu ketika dahulu, semasa saya menukar tapak web. Memerlukan bar menu atas untuk diperbaiki semasa bar skrol menatal. Saya juga menulis tentangnya secara umum, tetapi hanya menyebutnya dalam artikel Alamat artikel: kedudukan elemen tetap pemalam jQuery. Dalam artikel ini, kami akan meringkaskannya sekali lagi.

1.scrolltofixed plug-in function

Betulkan kedudukan elemen supaya elemen kekal dipaparkan apabila halaman menatal.

II.scrolltofixed alamat rasmi

https://github.com/bigspotteddog/ScrollToFixed. Terdapat arahan untuk digunakan pada alamat rasmi, dan penerangan tentang sifat dan kaedah pemalam di bawah. Terdapat juga kes penggunaan terperinci dalam demo, anda boleh memuat turunnya dan lihat.

3. Cara menggunakan scrolltofixed

Pemalam scrolltofix mempunyai pelbagai kegunaan Kami boleh membetulkan bahagian atas, bar sisi atau "membetulkan sebarang elemen pada halaman." Dengan menggunakannya bersama pemalam lain, anda boleh mendapatkan hasil yang sangat baik. Jika bar skrol dikesan mencapai kedudukan tertentu, elemen tertentu akan dipaparkan. Dalam kes ujian, kami menggunakan pemalam scrolltofix bersama-sama dengan pemalam scrollto Kesan khusus boleh dilihat dalam "fail ujian" di bawah.

1. Fail rujukan

Pemalam scrolltofixed sangat mudah digunakan, anda hanya perlu memetik dua js. Satu fail ialah jquery, dan satu lagi ialah fail js yang diperlukan oleh pemalam scrolltofixed.

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery-scrolltofixed.js"></script>

Fail gaya 2.css. Tidak ada keperluan untuk fail gaya untuk menggunakan pemalam, tetapi kita perlu mentakrifkan elemen kedudukan tetap dan elemen tersebut memerlukan gaya tersuai kita sendiri. Fail gaya tidak disiarkan di sini, anda boleh melihat "fail ujian" di bawah.

Kod 3.js. Inisialisasi boleh dicapai dalam satu ayat, atau sifat permulaan boleh ditetapkan mengikut keperluan. Seperti gaya elemen, gaya yang dipaparkan apabila ia ditetapkan, elemen mana yang dicapai, elemen tetap tidak lagi tetap, dsb. Anda boleh menonton demo rasmi.

//Artikel ini hanya menguji elemen tetap dan menggunakan atribut lalai
$('#operbox').scrollToFixed();

4. Elemen kedudukan tetap perlu menggunakan html. Anda boleh melihat "Fail Ujian" di bawah.

Apabila menguji pemalam scrolltofix, untuk meningkatkan kecekapan kes ujian, pemalam scrollto juga digunakan untuk menatal ke elemen yang ditentukan.
Persekitaran ujian: pelayar IE8, chrome, firefox. Keputusan ujian:

Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.