Js实现文字水平滚动

xiji666

于 2019-12-23 15:31:27 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript css html

本文链接：https://blog.youkuaiyun.com/weixin_43747105/article/details/103665867

本文介绍了一种使用JavaScript和CSS替代废弃的HTML marquee标签的方法，以创建更友好的文字水平滚动效果。通过提供的HTML、CSS和JS代码示例，实现了类似无缝滚动的公告栏功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

公司项目中有一个公告栏，写的时候我先想到了用marquee，于是发现了marquee有很多弊端，当文字全部显示完才出现新的文字，这样不是很友好，然后一查发现marquee这个标签已经被W3C标准废弃了，也就是不再支持使用这个标签了，于是我便用js+css去替代这个写法，并且做到类似无缝滚动的效果。直接上代码：

html代码:

<div id="scroll_div" class="fl">
	<div id="scroll_begin">
		<span class="pad_right">这是第一条信息的内容这是第一条信息的内容这是第一条信息的内容</span>
		<span class="pad_right">这是第二条信息的内容这是第二条信息的内容这是第二条信息的内容</span>

最低0.47元/天解锁文章