èªå¨æ»å¨ï¼ä¸»è¦æè·¯æ¯ç¨jsèªå¸¦çsetIntervalæ¹æ³ã
å®ä¹åç¨æ³
setInterval() æ¹æ³å¯æç §æå®çå¨æï¼ä»¥æ¯«ç§è®¡ï¼æ¥è°ç¨å½æ°æ计ç®è¡¨è¾¾å¼ã
setInterval() æ¹æ³ä¼ä¸åå°è°ç¨å½æ°ï¼ç´å° clearInterval() 被è°ç¨æçªå£è¢«å ³éãç± setInterval() è¿åç ID å¼å¯ç¨ä½ clearInterval() æ¹æ³çåæ°ã
è¯æ³
setInterval(code,millisec[,"lang"])
åæ°
code å¿ éãè¦è°ç¨çå½æ°æè¦æ§è¡ç代ç 串ã
millisec å¿ é¡»ãå¨ææ§æ§è¡æè°ç¨ code ä¹é´çæ¶é´é´éï¼ä»¥æ¯«ç§è®¡ã
è¿åå¼
ä¸ä¸ªå¯ä»¥ä¼ éç» Window.clearInterval() ä»èåæ¶å¯¹ code çå¨ææ§æ§è¡çå¼ã
ç®åçä¾åï¼ä» ä¾åèï¼
<style>*{ margin:0; padding:0; list-style:none;}
#box{ width:840px; border:1px solid #000; height:210px; margin:30px auto; position:relative; overflow:hidden;}
#box ul{ position:absolute; left:0; top:0;}
#box ul li{ width:200px; height:200px; float:left; padding:5px;}
</style>
<script>
window.onload=function(){
var oBox=document.getElementById('box');
var oUl=oBox.children[0];
var aLi=oUl.children;
//å¤å¶ä¸ä»½å 容
oUl.innerHTML+=oUl.innerHTML;
oUl.style.width=aLi.length*aLi[0].offsetWidth+'px';
setInterval(function(){
var l=oUl.offsetLeft+10;
if(l>=0){
l=-oUl.offsetWidth/2;
}
oUl.style.left=l+'px';
},30);
};
</script>
</head>
<body>
<div id="box">
<ul>
<li><img src="img/1.jpg" width="200"></li>
<li><img src="img/2.jpg" width="200"></li>
<li><img src="img/3.jpg" width="200"></li>
<li><img src="img/4.jpg" width="200"></li>
</ul>
</div>
</body>
<DIV id=demoleft style="OVERFLOW: hidden; WIDTH:600px;">
<TABLE border="0" align="left" cellPadding="0" cellSpacing="0" cellspace="0">
<TBODY>
<TR>
<TD width="600" align=middle vAlign=top id=demo1left>
<!--内容-->
<table width="600" height="120" border="0" cellpadding="0" cellspacing="0">
<tr>
<%
set rs=server.CreateObject("adodb.recordset")
rs.open "select top 8 * from cp_aboutus where userid="&hid&" order by updatetime desc,articleid desc ",conn,1,1
if not rs.eof then
dim hang
hang = 0
do while not rs.eof
hang = hang + 1
%>
<td>
<table width="110" height="115" border="0" align="center" cellpadding="0" cellspacing="0" id="table12">
<tr>
<td width="110" height="87"><%if rs("headpic")<>"" then%><a href="huicpshow.asp?hid=<%=hid%>&id=<%=rs("articleid")%>" title="<%=rs("title")%>" target="_blank"><img src="<%=rs("headpic")%>" width="110" height="87" border="0" /></a><%else response.Write "<table width=110 height=87 border=0 cellpadding=0 cellspacing=0><tr><td height=23 bgcolor=#EBEBEB align=center>暂无图片</td></tr></table>" end if%></td>
</tr>
<tr>
<td align="center"><a href="huicpshow.asp?hid=<%=hid%>&id=<%=rs("articleid")%>" title="<%=rs("title")%>" target="_blank"><%=rs("title")%></a></td>
</tr>
</table>
</td>
<%
rs.movenext
loop
end if
rs.close
set rs=nothing
%>
</tr>
</table>
<!--end 内容-->
</TD>
<TD width="102" vAlign=top id=demo2left></TD>
</TR>
</TBODY>
</TABLE>
</DIV>
<SCRIPT>
var speed=18//速度数值越大速度越慢,demo2.offsetWidth=demo1.offsetWidth=固定值
var demoleft = document.getElementById("demoleft");
var demo2left = document.getElementById("demo2left");
var demo1left = document.getElementById("demo1left");
demo2left.innerHTML=demo1left.innerHTML
function Marquee(){
if(demo2left.offsetWidth-demoleft.scrollLeft<=0)//其实demo.scrollLeft是有 最大值的，和demo0.width,引用的图片的width有关系。demo过了一半（每半内容一样的），重新开始循环
demoleft.scrollLeft-=demo1left.offsetWidth
else{
demoleft.scrollLeft++//不断的增加，相当于父容器的滚动条不断是缩小；但由于OVERFLOW: hidden; （滚动条不可见）
}
}
var MyMarleft=setInterval(Marquee,speed)
demoleft.onmouseover=function() {clearInterval(MyMarleft)}
demoleft.onmouseout=function() {MyMarleft=setInterval(Marquee,speed)}
</SCRIPT>本回答被提问者采纳
js定时器轮播图?
这个轮播图，我们通过两大模块构成；左右点击模块和姓名点击模块。然后在两者相关联来达到最终的效果。在使用js实现轮播图的效果前，先使用HTML和CSS完善这一模块的布局。本轮播图使用8张图片。每次出现两张。我们在使用HTML和CSS布局时可以先把第一组的两张图片放好位置。其他的放在两边隐藏起来。需要使用...
怎么用JS脚本使多张图片滚动?
推荐使用<marquee>实现图片滚动,示例:<marquee scrolldelay="100"direction="up"onmouseover="this.stop()"onmouseout="this.start()"><\/marquee> 其中scrolldelay="100"===>指滚动延迟时间,单位是毫秒ms,默认为90ms direction="up"===>指滚动方向,默认从左往右,可取的值为:up,down,left,right onmo...
js实现图片自动的滚动效果
自动滚动，主要思路是用js自带的setInterval方法。定义和用法 setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。语法 setInterva...
js,html,css 讲2张图片 每隔5秒 轮流循环显示。
var theA=new Array(2); 两张图片，也可以是写成3，写成三就是3张图片 for(i=0,n=theA.length;i<n;i++){theA[i]=new Image(); theA[i].src=i+'.jpg';} var currentImage=1;var run=true;var speed=5000; \/\/这个是5秒中 function changeSize1(){ if(!document.images)retu...
求JS 大神,教教我图片轮播、、好心求解
要实现图片滚动轮播，可以有很多方式，无非是通过调整外围容器的位置（left\/top）或者内部图片容器的定位（marin-left\/margin-top）来实现的。这里我以前者为例（向左滚动）：通常的实现方式是：1) 有一个外层容器，同时作为“视口”，这个viewPort有固定的尺寸，超出的部分隐藏，定位方式为“relative”；2...
js原生轮播图?
js实现效果:循环轮播图首先来讲一下我的思路：我们要想无缝切换图片，必须要在所有图片的最后添加一张第一张图片，因为要实现从最后一张切换到第一张时有过渡效果；之后我们要让你处在第一张时，向前向后切换都要进行隐式切换。在使用js实现轮播图的效果前，先使用HTML和CSS完善这一模块的布局。本...
JS实现图片的浮动,当鼠标向下滑动时,图片始终位于页面的上方,图片随...
上面的是你的要求。下面是一个小例子。可以实现图片在页面上滚动。 var left = 0;var top = 0;function moveImage(){ if(left > (document.body.clientWidth)-(document.getElementById("div1").offsetWidth)-4){ left = -left;} if(top > (document.body.clientHeight)-(document.getElement...
求JS控制的图片由下向上滚动代码,需要滚动一次停留几秒的
使用jquery吧，很容易解决注意要包含jquery.js，网上下载吧，很多的。具体实现如下： function AutoScroll(obj){ (obj).find("ul:first").animate({ marginTop:"-25px"},500,function(){ (this).css({marginTop:"0px"}).find("li:first").appendTo(this);});} (document).ready(function...
js图片向上滚动一卡一卡的,求解决。
最后的代码中，滚动的步长改为1window.onload=function(){ new Marquee( "scroll", \/\/容器ID 0, \/\/向上滚动(0向上 1向下 2向左 3向右) 1, \/\/滚动的步长 173, \/\/容器可视宽度 149, \/\/容器可视高度 50, \/\/定时器 数值越小，滚动的速度越快(1000=1秒,建议不...
简单轮播图的实现及原理讲解(js)
之所用js添加小圆点，是因为小圆点的数量是由图片张数决定的。默认 li 的 class 为 quiet , 第一张默认为 active 。首先先理解该轮播图如何滚动，这里是通过控制 img_ul 的 left 值来控制显示某张图片， 为了实现“滚动”的效果，我们需要 逐渐 改变 img_ul 的 left 值，而不能直接使该值...
