Javascript 一段时间后如何更改图像背景?
大家好 我需要知道是否有办法在特定时间后改变背景图像,如10秒或30秒…等等。 你知道像雅虎登录邮件“它每天都在改变背景!!”Javascript 一段时间后如何更改图像背景?,javascript,asp.net,jquery,html,css,Javascript,Asp.net,Jquery,Html,Css,大家好 我需要知道是否有办法在特定时间后改变背景图像,如10秒或30秒…等等。 你知道像雅虎登录邮件“它每天都在改变背景!!” 如果有一种使用JQuery、CSS、html或其他任何东西的方法,请告诉我你可以使用javascript函数 <!DOCTYPE html> <html> <head> <script type='text/javascript'> var imageID=0; function changeimage(every_sec
如果有一种使用JQuery、CSS、html或其他任何东西的方法,请告诉我你可以使用javascript函数
<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'>
var imageID=0;
function changeimage(every_seconds){
//change the image
if(!imageID){
document.getElementById("myimage").src="http://www.all-freeware.com/images/full/38943-nice_feathers_free_screensaver_desktop_screen_savers__nature.jpeg";
imageID++;
}
else{if(imageID==1){
document.getElementById("myimage").src="http://www.hickerphoto.com/data/media/186/flower-bouquet-nice_12128.jpg";
imageID++;
}else{if(imageID==2){
document.getElementById("myimage").src="http://www.photos.a-vsp.com/fotodb/14_green_cones.jpg";
imageID=0;
}}}
//call same function again for x of seconds
setTimeout("changeimage("+every_seconds+")",((every_seconds)*1000));
}
</script>
</head>
<body style='background:black;' onload='changeimage(2)'>
<div style='position:absolute;width:100%;height:100%;left:0px;top:0px;' align='center'><img width='300px' height='250px' id='myimage' src='http://www.photos.a-vsp.com/fotodb/14_green_cones.jpg'/></div>
</body></html>
var-imageID=0;
功能更改图像(每_秒){
//更改图像
如果(!imageID){
document.getElementById(“myimage”).src=”http://www.all-freeware.com/images/full/38943-nice_feathers_free_screensaver_desktop_screen_savers__nature.jpeg";
imageID++;
}
else{if(imageID==1){
document.getElementById(“myimage”).src=”http://www.hickerphoto.com/data/media/186/flower-bouquet-nice_12128.jpg";
imageID++;
}else{if(imageID==2){
document.getElementById(“myimage”).src=”http://www.photos.a-vsp.com/fotodb/14_green_cones.jpg";
imageID=0;
}}}
//再次调用相同的函数,持续x秒
设置超时(“更改图像(“+每_秒+”),((每_秒)*1000));
}
试试这个!:) 您可以使用函数和setTimeout来完成:
function changeBG()
{
var body = document.getElementsByTagName("body")[0];
body.style.backgroundImage = "url(myimage.gif)";
setTimeout("changeBG",30000); // Change every 30 seconds
}
window.onload = changeBG;
(未经测试,因此可能需要调整或2)您可以使用javascript的
setTimeout
或setInterval
来完成此操作,或查看
编辑:
使用JQuery,这将在1秒后更改背景:
$(window).oneTime(1000, function() {
// change your background image here
});
您可能可以使用CSS3 webkit动画来实现它,但折衷是,它只适用于Chrome和Safari等浏览器,但您根本不需要任何JavaScript 我想上面的jQuery建议是您在这里的最佳选择。如果您正在使用库:
我真的很想用JQuery来解决这个问题,但是你能给我一个关于这个问题的示例页面吗(
var changeBackground = function() {
$$('body').first().setStyle({
backgroundImage: 'newImage.jpg'
});
};
changeBackground.delay(15);