Rumah >hujung hadapan web >tutorial js >Penjelasan terperinci tentang langkah-langkah untuk mencipta berita tatal lancar dengan JQuery

Penjelasan terperinci tentang langkah-langkah untuk mencipta berita tatal lancar dengan JQuery

PHPz
PHPzasal
2016-05-16 15:07:111579semak imbas

Artikel ini terutamanya memperkenalkan kaedah mencipta berita tatal lancar berdasarkan JQuery. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

Pertama sekali, kami mempunyai sekeping kod html di sini, yang sangat ringkas, seperti yang ditunjukkan di bawah:

<ul>
<li>你说我是好人吗,我是好人啊</li>
<li>哈哈,我真的不知道说什么了</li>
<li>生活就是应该平淡的</li>
<li>像上学一样的工作</li>
</ul>
</div>

Kemudian apa yang perlu kita lakukan Hanya buat tatalnya dengan lancar.

Idea:

Mula-mula kami memperkenalkan JQuery dan mendapatkan kandungan elemen pertama dalam senarai elemen li

Kemudian kami memaparkan semua kandungan Senarai elemen li, di sini kami gunakan kaedah induk() untuk mendapatkan kandungan senarai semua elemen li;

disambungkan kepada perkara di atas, dan perkara seterusnya yang perlu dilakukan ialah menyembunyikan elemen li pertama

Akhir sekali, gunakan setInterval('scroll_news()',1000);

Kod lengkap terakhir adalah seperti berikut:

Di atas ialah keseluruhan kandungan bab ini Untuk lebih banyak tutorial berkaitan, sila lawati

tutorial video jQueryt
<script type="text/javascript">
function scrollNews(){
$(document).ready(function(){
  $(&#39;#tag li&#39;).eq(0).fadeOut("slow",function(){
   $(this).clone().appendTo($(this).parent()).fadeIn("slow");
   $(this).remove();
  });
});
}
setInterval(&#39;scrollNews()&#39;,1000);
</script>
!

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