Heim >Web-Frontend >js-Tutorial >Detaillierte Erläuterung der Schritte zum Erstellen nahtloser Bildlaufnachrichten mit JQuery
In diesem Artikel wird hauptsächlich die Methode zum Erstellen nahtloser Bildlaufnachrichten basierend auf JQuery vorgestellt. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Zuallererst haben wir hier einen solchen HTML-Code, der sehr prägnant ist, wie unten gezeigt:
<ul> <li>你说我是好人吗,我是好人啊</li> <li>哈哈,我真的不知道说什么了</li> <li>生活就是应该平淡的</li> <li>像上学一样的工作</li> </ul> </div>
Dann müssen wir dafür sorgen, dass alles nahtlos scrollt.
Idee:
Zuerst führen wir JQuery ein und erhalten den Inhalt des ersten Elements in der Li-Elementliste.
Dann zeigen wir alle Li-Elemente an. Listeninhalt, hier verwenden wir die Methode parent(), um den Listeninhalt aller li-Elemente abzurufen;
hängt mit dem oben Gesagten zusammen, und als nächstes müssen Sie das erste li-Element ausblenden. Verwenden Sie schließlich setInterval('scroll_news()',1000); und rufen Sie es wiederholt auf. Der endgültige vollständige Code lautet wie folgt:Das Obige ist der gesamte Inhalt dieses Kapitels. Weitere verwandte Tutorials finden Sie im
jQueryt-Video-Tutorial<script type="text/javascript"> function scrollNews(){ $(document).ready(function(){ $('#tag li').eq(0).fadeOut("slow",function(){ $(this).clone().appendTo($(this).parent()).fadeIn("slow"); $(this).remove(); }); }); } setInterval('scrollNews()',1000); </script>!