导航:首页 > 编程语言 > js不间断滚动

js不间断滚动

发布时间:2023-05-24 15:57:34

js文字由左向右无间断滚动效果

<script type="text/javascript">
var speed=30;
demo2.innerHTML=demo1.innerHTML;
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth;
else{
demo.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed);
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
demo的css一定要设定width和overflow:hidden
<div id="demo">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<div id="demo1">
<table width="1000" height="172" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
文字放这里
</td>
</tr>
</table>
</div>
</td>
<td>
<div id="demo2"></div>
</td>
</tr>
</table>
</div>
原理demo2复制demo1然后连成一行,demo1滚动完滚动demo2因为内容一样所以看不出来,demo2滚动完滚动demo1

⑵ 求个 JS不间断向下翻屏滚动,每张图可以停留几个秒,鼠标放在上面就停止的 代码。 跪求!!!!

第一认识 MARQUEE:
Marquee标记用于在可用浏览区域中滚动文本。这个标记只适用于IE3以后的版的浏览器。
格式:
<MARQUEE ALIGN="…" 用于按设定的值对齐滚动的文本。ALIGN可以设定的值有:LEFT,CENTER,RIGHT。。。。
BEHAVIOR="…" 可以在页面上一旦出现文本时让浏览器按照设定的方法来处理文本
BGCOLOR="…" BGCOLOR:用于设定字幕的背景颜色
DIRECTION="…" 用于设定文本滚动的方向
HEIGHT="…" 用于设定滚动字幕的高度
WIDTH="…" 用于设定字幕的宽度
HSPACE="…" 用于设定滚动字幕左右的空白空间
VSPACE="…" 用于设定滚动字幕上下的空白空间
LOOP="…" 于设定滚动字幕的滚动次数。当LOOP的值为"INFINITE"或是"-1"时,则文字会无限制地滚动
SCROLLAMOUNT="…" 用于设定每个连续滚动文本后面的间隔,该间隔用像素表示。
SCROLLDELAY="…" 用于设定两次滚动操作之间的间隔时间,该时间以毫秒为单位。
>…
</MARQUEE>

一个简单使用的示例:
<marquee direction="up" width="100" bgcolor="#ffcc66" style="Z-INDEX: 124; LEFT: 80px; POSITION: absolute; TOP: 312px" onmouseover="this.stop()" onmouseout="this.start()">///onmouseover="this.stop()"响应鼠标经过事件——文字停止移动
///onmouseout="this.start()"鼠标移开事件的响应——文字继续移动
//下面是创建DataList用于能动态更新显示的文字,(既更新数据库就能更新文字)
〈asp:DataList ID="DataList1" Runat="server" Font-Size="Smaller"〉
〈ItemTemplate〉
〈table width="100" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100" align="center" valign="middle"><%# DataBinder.Eval(Container.DataItem,"公告内容") %></td>
</tr>
</table>
</ItemTemplate>
</asp:DataGrid>
//以上就是将DataList 的数据源帮定到"公告内容"字段,具体的DataLis的数据帮定和DataGrid基本一样,很多.net 的书都讲的有,请网友自己去参考其他资料.
</marquee>

⑶ js中怎么实现图片不间断的向左滚动效果,要那种代码清晰的~

<script type="text/javascript">
var speed = 20;//滚动速度
var maq;
var m1;//第一份滚动的内容
var m2;//第二份滚动的内容
var timer;//定时器
function run(){
if(m1.offsetWidth<=maq.scrollLeft){
maq.scrollLeft-=m1.offsetWidth;
}else{
maq.scrollLeft+=6;
}
}
window.onload=function(){
maq=document.getElementById("maq");
m1=document.getElementById("m1");
m2=document.getElementById("m2");
m2.innerHTML=m1.innerHTML;
if(timer==null){
timer=window.setInterval(run,speed);
}
maq.onmouseover=function(){
window.clearInterval(timer);
}
maq.onmouseout=function(){
timer=window.setInterval(run,speed);
}
}
</script>
</head>
<body>
<div id="maq" style="height:200px; width:180px; overflow:hidden">
<table>
<tr>
<td id="m1">
<table>
<tr>
<td><img src="file:///E|/Images/player1.png" width="174" height="268" /></td>
<td><img src="file:///E|/Images/player2.png" width="174" height="268" /></td>
<td><img src="file:///E|/Images/player3.png" width="174" height="268" /></td>

</tr>
</table>
</td>
<td id="m2"></td>
</tr>
</table>
</div>
</body>
楼主详细代码在这里这已经是相当的简介版了你只要把图片路径改一下就能用了,~要采纳呦~你懂得~~

⑷ 关于如何使用js不断循环上下滚动

我一般的解决方法就是,重复循环要滚动的内容,比如里面有5张图片吧,把这张图片连续放3次,也就相当于展示15张图,滚动的内容多,一般情况下就不会停止不动了。

⑸ JS上下文字滚动,怎么改成无限循环的,还有就是滚动速度怎么改

我有一个文字上下无限循环滚动的代码。。你看看


你也可以去网上搜集一点那种素材。。懒人图库 、17素材都有

⑹ js实现图片滚动效果

<SCRIPT language="JavaScript">
var speed=50; //设置滚动速度
demo2.innerHTML=demo1.innerHTML //复制dome1为dome2
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0) //当滚动至dome1与dome2交界时
demo.scrollTop-=demo1.offsetHeight //dome跳到最顶端
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed) //设置定时器
demo.onmouseover=function() {clearInterval(MyMar)}//鼠标移上时清除定时器达到滚动停止的目的
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}//鼠标移开时重设定时器,继续滚动
</SCRIPT>

<div id="demo" style="overflow: hidden; height: 600; width: 180; background: #214984; color: #ffffff">
<div id="demo1" align="center">
<!-- 定义图片 -->
</div>
<div id="demo2" align="center"></div>
</div>

阅读全文

与js不间断滚动相关的资料

热点内容
40岁男人适合的微信名 浏览:925
编程里比例怎么打 浏览:215
苹果12两个app如何分屏 浏览:592
ps下载完不是压缩文件 浏览:362
电脑中的个人文件包括什么 浏览:572
网络连接一般什么密码 浏览:199
java定时器quartz实例 浏览:259
稻壳excel文件太大怎么弄 浏览:901
文件里的视频如何保存到相册 浏览:428
手机百度云文件电脑 浏览:957
编程怎么做到时钟精准 浏览:912
锤子用过的壁纸在哪个文件里 浏览:468
qq网站安全性未知访问不了怎么办 浏览:270
燕秀怎么修改编程人名字 浏览:789
2012年天之眼导航升级 浏览:595
如何安装视频文件 浏览:315
红米2A升级miui9 浏览:927
如何在表格中加入一行数据库 浏览:421
dnf远古二能升级85吗 浏览:251
extjsbbar属性 浏览:355

友情链接