Rumah  >  Artikel  >  hujung hadapan web  >  jquery berhenti menghidupkan

jquery berhenti menghidupkan

WBOY
WBOYasal
2023-05-18 17:31:401510semak imbas

jQuery ialah perpustakaan JavaScript yang digunakan secara meluas dalam pembangunan web Fungsi animasinya yang fleksibel boleh meningkatkan pengalaman pengguna tapak web dengan berkesan. Dalam pembangunan sebenar, banyak pembangun telah menghadapi situasi di mana mereka perlu menghentikan animasi yang dilaksanakan. Artikel ini akan memperkenalkan cara menghentikan kesan animasi jQuery.

1 Gunakan kaedah stop()

jQuery menyediakan kaedah stop() yang boleh digunakan untuk menghentikan kesan animasi yang sedang berjalan. Sintaks kaedah ini adalah seperti berikut:

$(selector).stop(stopAll, gotoEnd);

Antaranya, pemilih ialah elemen yang akan dianimasikan stopAll ialah parameter pilihan yang digunakan untuk menentukan sama ada untuk menghentikan semua kesan animasi yang sedang dijalankan (nilai lalai adalah palsu, iaitu, hanya Hentikan animasi semasa); gotoEnd ialah satu lagi parameter pilihan yang digunakan untuk menentukan tempat untuk menghentikan kesan animasi (nilai lalai adalah palsu, yang bermaksud berhenti pada kedudukan semasa).

Berikut ialah contoh mudah yang menunjukkan cara menghentikan animasi berjalan:

$(document).ready(function(){
    $("button").click(function(){
        $("#box").animate({left: '250px'}, 5000);
    });
    $("#stop").click(function(){
        $("#box").stop();
    });
});

Dalam contoh ini, apabila pengguna mengklik butang, elemen dengan id "kotak" akan menjadi Animasi kesan yang berlangsung selama 5 saat dan bergerak ke kiri. Apabila pengguna mengklik pada elemen dengan id "berhenti", animasi akan dihentikan.

2. Gunakan kaedah clearQueue()

Selain kaedah stop(), jQuery juga menyediakan kaedah clearQueue() untuk mengosongkan baris gilir pada elemen. Biasanya, apabila kesan animasi dihentikan, semua animasi pada baris gilir dikosongkan. Walau bagaimanapun, jika anda tidak mahu menghentikan animasi semasa, tetapi ingin mengosongkan kesan animasi lain, maka kaedah clearQueue() akan sangat berguna.

Sintaks kaedah ini adalah seperti berikut:

$(selector).clearQueue(queueName);

Antaranya, queueName ialah parameter pilihan yang digunakan untuk menentukan nama baris gilir yang hendak dikosongkan. Jika parameter ini tidak dinyatakan, semua kesan animasi pada baris gilir lalai akan dikosongkan.

Berikut ialah contoh yang menunjukkan cara mengosongkan kesan animasi lain selain animasi semasa apabila menghentikan animasi:

$(document).ready(function(){
    $("button").click(function(){
        $("#box").animate({left: '250px'}, 5000);
        $("#box").animate({top: '100px'}, 5000);
    });
    $("#stop").click(function(){
        $("#box").stop(false, true).clearQueue();
    });
});

Dalam contoh ini, apabila pengguna mengklik butang, id Lakukan animasi kesan untuk elemen "kotak" mula-mula bergerak ke kiri dan kemudian bergerak ke bawah. Apabila pengguna mengklik pada elemen dengan id "berhenti", animasi pergerakan ke bawah akan dihentikan, tetapi kesan animasi pergerakan kiri akan dikekalkan. Pada masa yang sama, kesan animasi lain juga dikosongkan.

Ringkasan:

Jika anda ingin menghentikan kesan animasi yang sedang berjalan, anda boleh menggunakan kaedah stop() jika anda ingin mengosongkan kesan animasi lain dalam baris gilir apabila menghentikan animasi, anda boleh menggunakan kaedah clearQueue(). Dalam pembangunan sebenar, pilih kaedah yang berbeza mengikut keperluan untuk mencapai matlamat anda.

Atas ialah kandungan terperinci jquery berhenti menghidupkan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

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