实现移动端信息无缝滚动
<div style="position:relative; height:5rem">
<div id="demo" style="position:absolute;width:100%;height: 4rem; overflow:hidden; text-align:center;margin: .5rem 0;">
<div id="demo1">
<p><span>广东省广州市 网友：186****0751</span>通过提交需求得到了律师帮助</p>
<p><span>江苏省南京市 网友：138****7913</span>通过提交需求得到了律师帮助</p>
<p><span>广西省南宁市 网友：136****8755</span>通过提交需求得到了律师帮助</p>
<p><span>浙江省杭州市 网友：188****3421</span>通过提交需求得到了律师帮助</p>
<p><span>广东省惠州市 网友：134****2244</span>通过提交需求得到了律师帮助</p>
<p><span>广东省东莞市 网友：132****9649</span>通过提交需求得到了律师帮助</p>
<p><span>湖南省长沙市 网友：138****1354</span>通过提交需求得到了律师帮助</p>
<p><span>湖北省武汉市 网友：189****8828</span>通过提交需求得到了律师帮助</p>
</div>
<div id="demo2"></div>
</div>
</div>css代码：
#demo div{
color: #3a3a3a;
font-size: .34rem;
line-height: .8rem;
}
#demo div span{
color: #f65c53;
}js代码：
<script>
var speed = 40
var demo = document.getElementById("demo");
var demo2 = document.getElementById("demo2");
var demo1 = document.getElementById("demo1");
demo2.innerHTML = demo1.innerHTML;
function Marquee() {
if (demo2.offsetTop - demo.scrollTop <= 0) {
demo.scrollTop -= demo1.offsetHeight;
} else {
demo.scrollTop++;
}
}
var MyMar = setInterval(Marquee, speed);
demo.onmouseover = function () { clearInterval(MyMar) }
demo.onmouseout = function () { MyMar = setInterval(Marquee, speed) }
</script>注意：内容的高度必须大于容器的高度，否则无法滚动
本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！
