JavaScript文字无缝滚动效果
文字上下相接滚动的效果，用JavaScript就能搞定，效果还蛮顺滑的。代码结构也不复杂，主要靠一个Marquee函数搞定循环滚动，用了点小技巧把li内容复制一遍，造出无缝滚动的假象。速度可以调，逻辑也清晰，适合需要做公告栏、新闻滚动那类场景。
嗯，核心逻辑就是通过offsetHeight判断临界点，当滚动到一定高度后重置位置，整个过程挺流畅。你也可以在这个基础上扩展，比如加点hover暂停啊，或者加点动画优化。
类似的滚动方案你也可以看看这些：JS 文字滚动效果、HTML 内容循环滚动、jQuery 上下滚动。都还挺好用，各有风格。
如果你在做文字列表展示、新闻滚动、公告提示这些功能，可以优先试试这个写法，兼容性也比较友好。需要注意的是，innerHTML += innerHTML会复制所有子节点，注意避免多余的事件或样式重复哦。
文件大小：2.04KB
评论区