今天要实现个文字滚动的效果，一开始试了<marquee></marquee>这个标签，但是 发现效果不太好，不能无缝滚动，而且在手机上有卡顿不太流畅。决定用js去实现。
首先写个标签，注意下标签里面文字的长度要超出标签，因为我下面加了判断，如果没有超出就不会有滚动条，也就不会滚动哦~
<style> #scrollobj{ min-width: 70px; /*先在这里写个最小宽度*/ display: inline-block; white-space: nowrap; overflow: hidden; } </style> <body> <div id="scrollobj">这里是滚动内容纯文字哈哈哈，滚动吧</div> </body>
在你的页面里调用这个方法就ok了。
function sc() { var $scrollobj = document.getElementById('scrollobj'); function scroll(self) { /*往左*/ var tmp = (self.scrollLeft)++; //当滚动条到达右边顶端时 if (self.scrollLeft == tmp) { self.innerHTML += " " + self.innerHTML; } //当滚动条滚动了初始内容的宽度时滚动条回到最左端 if (self.scrollLeft >= self.firstChild.offsetWidth) { self.scrollLeft = 0; } } if ($scrollobj.scrollWidth > $scrollobj.offsetWidth) { // 判断是否需要滚动 var timer = setInterval(function () { scroll($scrollobj); }, 30); } }