文字向左无缝滚动marquee

最新推荐文章于 2023-11-17 11:19:37 发布

薇光网站建设

最新推荐文章于 2023-11-17 11:19:37 发布

阅读量3.4k

点赞数 1

分类专栏： Javascript 实例文章标签： javascript html5 html jquery css3

本文链接：https://blog.csdn.net/qq_17475727/article/details/117922106

版权

本文介绍了如何使用HTML5的marquee标签来创建文字无缝向左滚动的效果。尽管该方法可能已较为传统，但在某些场景下仍能有效解决问题。

摘要由CSDN通过智能技术生成

文字向左无缝滚动 marquee 标签

用这个标签做滚动可能已经过时了，但真的是狠好用，超级解决问题！

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{padding: 0;margin: 0;}
.scrollbox{background:#f60;width:384px;padding:0 10px;overflow: hidden; white-space:nowrap;height: 40px;line-height: 40px;}
.scrollbox h1{color: #fff;font-family:微软雅黑!important;font-weight: bold;font-size: 24px;}
</style>
</head>
<body>

<div class="scrollbox">

	<marquee name=news behavior=scroll direction=left scrollamount=2 scrolldelay=1 hspace=0 vspace=0 onMouseOver="this.stop()" onMouseOut="this.start()" >
		
		<h1>滚动测试内容测试内容测试内容，滚动测试内容测试内容测试内容</h1>

	</marquee>
</div>

<script>
<!-- Begin
var ostat = false;
function scrollstop() {
news.scrollAmount = 0;
os