html5中跑马灯的代码大全

发布时间:2025-12-10 13:04:49 浏览次数:5

HTML5中跑马灯是一项简单而实用的功能,可以用于展示滚动文字、图片、广告等内容,为用户提供更好的观看体验。下面是HTML5中跑马灯的代码大全:

<!-- 文字跑马灯 --><marquee>这是一个简单的文字跑马灯</marquee><!-- 图片跑马灯 --><marquee><img src="图片1.jpg" /><img src="图片2.jpg" /><img src="图片3.jpg" /></marquee><!-- 无限循环滚动文字 --><p ><p>这是滚动文字1</p><p>这是滚动文字2</p><p>这是滚动文字3</p></p><!-- 有限次数循环滚动文字 --><p ><p>这是滚动文字1</p><p>这是滚动文字2</p><p>这是滚动文字3</p></p><script>var scrollDiv = document.querySelector(".scroll-text");var scrollP = scrollDiv.querySelectorAll("p");var i = 0;var timer = setInterval(function() {if (i < scrollP.length) {scrollDiv.scrollTop += scrollP[i].offsetHeight;i++;} else {i = 0;clearInterval(timer);}}, 2000);</script>
需要做网站?需要网络推广?欢迎咨询客户经理 13272073477