使用JS如何实现文字无缝滚动

 我来答
lh761341
2018-07-17 · 超过23用户采纳过TA的回答
知道答主
回答量:66
采纳率:77%
帮助的人:9.1万
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
.wrap{width:800px;height:500px;margin:200px auto 0;position: relative;border:1px solid #000;overflow: hidden;}
h1{position: absolute;left:800px;word-break: keep-all;}
</style>
<body>
<div class="wrap">
<h1>这是无缝滚动</h1>
<h1>这是无缝滚动</h1>
</div>
<script>
var wenzi=document.querySelectorAll("h1");
var speed1=0;
var speed2=0;
var flag=false;
setInterval(function(){
speed1-=10;
wenzi[0].style.left=800+speed1+"px";
wenzi[1].style.left=800+speed2+"px";
if(wenzi[0].offsetLeft==0){
flag=true;
}
if(flag){
speed2-=10;
}
if(wenzi[0].offsetLeft==0){
speed2=0;
}
if(wenzi[1].offsetLeft==0){
speed1=0;
}

},60)
</script>
</body>
</html>
纯手敲 觉得有用可以点个赞啊
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
落允玦E9
2021-04-11 · 超过30用户采纳过TA的回答
知道答主
回答量:136
采纳率:88%
帮助的人:21.7万
展开全部

活动作品如何在一个网页实现登录_注册表单切换?14分钟带你使用CSS+JS实现炫酷滑动切换效果

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式