이 글에서는 주로 JQuery를 기반으로 끊김없는 스크롤 뉴스를 만드는 방법을 소개합니다. 참조를 위해 모든 사람과 공유하세요. 세부 사항은 다음과 같습니다.
우선 여기에는 아래와 같이 매우 간결한 HTML 코드 조각이 있습니다.
<ul> <li>你说我是好人吗,我是好人啊</li> <li>哈哈,我真的不知道说什么了</li> <li>生活就是应该平淡的</li> <li>像上学一样的工作</li> </ul> </div>
그럼 우리가 해야 할 일은 그냥 원활하게 스크롤되도록 만드는 것입니다.
아이디어:
먼저 JQuery를 소개하고 li 요소 목록의 첫 번째 요소 콘텐츠를 가져옵니다.
그런 다음 모든 li 요소 목록 콘텐츠를 표시합니다. 모든 li 요소의 목록 콘텐츠를 가져오는 parent() 메서드
다음으로 해야 할 일은 가져온 첫 번째 li 요소의 콘텐츠를 뒤에 있는 모든 li 요소의 목록 콘텐츠에 추가하는 것입니다.
은 위와 연결되어 있고, 다음으로 할 일은 첫 번째 li 요소를 숨기는 것입니다. 마지막으로 setInterval('scroll_news()',1000);을 사용하여 반복적으로 호출할 수 있습니다. 최종 완성 코드는 다음과 같습니다.<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>
jQueryt 비디오 튜토리얼을 방문하세요. !