javascript如何实现定时几秒换图片
javascript如何实固定几秒换图片比如网页一张图片固定3秒要换一张怎么实现?二楼的能否具体一点img的id是什么还有src="XX这个是不是图片的地址如果我图在im...
javascript如何实固定几秒换图片 比如网页一张图片固定3秒要换一张 怎么实现?
二楼的能否具体一点 img的id是什么 还有src="XX 这个是不是图片的地址 如果我图在image/1.JPG 和image/2.JPG 怎么写 展开
二楼的能否具体一点 img的id是什么 还有src="XX 这个是不是图片的地址 如果我图在image/1.JPG 和image/2.JPG 怎么写 展开
4个回答
展开全部
这个主要是用了js的定时器功能。下面是简单的代码,仅供参考:
<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>简单的说一下定时器:
setInterval定义和用法
setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。
setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
语法
setInterval(code,millisec[,"lang"])
参数
code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔,以毫秒计。
展开全部
把图片路径存入数组,用定时器
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<body>
<script type="text/javascript">
setInterval(show,2000);//每隔2秒改变一次
function show()
{
var number = Math.ceil(Math.random()*2);//有几张图片就乘以几
document.getElementById("radom_img").src="image/"+number+".jpg";//随机显示的话可以用随机函数来生成相应的图片名
}
</script>
<img id="radom_img" width="700" height="500"/>
//img的id就是图片标签的id
<script type="text/javascript">
setInterval(show,2000);//每隔2秒改变一次
function show()
{
var number = Math.ceil(Math.random()*2);//有几张图片就乘以几
document.getElementById("radom_img").src="image/"+number+".jpg";//随机显示的话可以用随机函数来生成相应的图片名
}
</script>
<img id="radom_img" width="700" height="500"/>
//img的id就是图片标签的id
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
思路是,每隔3000ms执行一次函数,函数将图片URL指向一个数组的下一位元素
<head><script type="text/javascript">
var char = ["image/1.jpg","image/2.jpg","image/3.jpg"];
var i = 0;
function changeImage()
{
if (i >= char.length) {i = 0;}
doucument.getElementById(img1).ImageUrl = char[i];
i++;
}
function rapidChange()
{
setTimeout(changeImage,3000);
}
</script>
</head>
<body>
<script type="text/javascript">
window.onload = rapidChange();
</script>
<asp:Image ID="img1" runat= server/>
</body>
如果有不了解的,可以来我空间hi我
<head><script type="text/javascript">
var char = ["image/1.jpg","image/2.jpg","image/3.jpg"];
var i = 0;
function changeImage()
{
if (i >= char.length) {i = 0;}
doucument.getElementById(img1).ImageUrl = char[i];
i++;
}
function rapidChange()
{
setTimeout(changeImage,3000);
}
</script>
</head>
<body>
<script type="text/javascript">
window.onload = rapidChange();
</script>
<asp:Image ID="img1" runat= server/>
</body>
如果有不了解的,可以来我空间hi我
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询