Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Menggunakan jQuery untuk Menunjukkan dan Menyembunyikan Div pada Selang Set?

Bagaimanakah Saya Boleh Menggunakan jQuery untuk Menunjukkan dan Menyembunyikan Div pada Selang Set?

Mary-Kate Olsen
Lepaskan: 2024-12-08 12:46:11
asal
196 orang telah melayarinya

How Can I Use jQuery to Show and Hide Divs at Set Intervals?

Tunjukkan dan Sembunyikan Div pada Selang Masa Tertentu Menggunakan jQuery

Dengan memanfaatkan fungsi setInterval jQuery, adalah mungkin untuk memaparkan div pada selang masa yang telah ditetapkan dan mengawal keterlihatan mereka dalam urutan. Berikut ialah gambaran keseluruhan terperinci tentang langkah-langkah yang terlibat:

Pelaksanaan Kod:

Mulakan dengan mentakrifkan struktur HTML anda, mencipta tiga div (div1, div2, div3) dan menyembunyikannya pada mulanya.

<div>
Salin selepas log masuk

Dalam kod JavaScript anda, buat fungsi yang dipanggil showDiv() untuk mengawal paparan div. Dalam fungsi ini, gunakan pemboleh ubah pembilang untuk lelaran melalui div dan tunjukkan satu demi satu.

function showDiv() {...}
Salin selepas log masuk

Mulakan pembilang untuk menjejaki div semasa dan gunakan fungsi jQuery stop() untuk membatalkan sebarang yang sedang berjalan animasi.

var counter = 0;
$('div', '#container').stop().hide();
Salin selepas log masuk

Untuk memaparkan div semasa, gunakan fungsi penapis() jQuery untuk memilih div yang sesuai berdasarkan kaunter, dan kemudian tunjukkan menggunakan show('fast').

.filter(function() {...}).show('fast');
Salin selepas log masuk

Naikkan atau tetapkan semula pembilang untuk memastikan urutan berulang selepas mencapai div terakhir.

counter == 3 ? counter = 0 : counter++;
Salin selepas log masuk

Akhir sekali, mulakan pemasa menggunakan setInterval dan tetapkan selang masa yang diingini (5000 milisaat dalam kes ini).

var timer = setInterval(showDiv, 5000);
Salin selepas log masuk

Penyelesaian ini menawarkan cara yang fleksibel dan boleh disesuaikan untuk menunjukkan dan menyembunyikan div pada selang masa tertentu, menjadikannya sesuai untuk senario yang memerlukan paparan berjujukan atau bermasa.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggunakan jQuery untuk Menunjukkan dan Menyembunyikan Div pada Selang Set?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan