标签:no-repeat out type jquery timeout flow rip .com change
setTimeout和setInterval
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>setInterval和setTimeout</title>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<style>
*{margin: 0;padding: 0;}
.one{width: 100px;height: 100px;overflow: hidden;}
.aa{width: 100px;height: 100px;}
.aa:nth-child(1){background: red;}/* :nth-child(n) 匹配其父元素的第n个子元素,不论类型*/
.aa:nth-child(2){background: green;}
.aa:nth-child(3){background: purple;}
.img{width: 100px;height: 100px;}
.img img{width: 100px;height: 100px;background-size: 100px 100px;}
</style>
</head>
<body>
<div class="one">
<div class="aa"></div>
<div class="aa"></div>
<div class="aa"></div>
</div>
<div class="img"></div>
<script>
var x=0;
function Odisplay()
{
$(‘.one .aa‘).hide();
$(‘.one .aa‘).eq(x).show();
x=x+1;
if(x==$(‘.one .aa‘).length){x=0;}
}
setInterval(‘Odisplay()‘,1000);
var j = 1;
function changeUrl()
{
//var imgurl = $(‘.img‘).html(‘<img src="img/timo0‘+j+‘.jpg">‘);
var imgurl = $(‘.img‘).css(‘background‘,‘url(img/timo0‘+j+‘.jpg) no-repeat‘);
j++;
if(j==4){j=1;}
setTimeout(‘changeUrl()‘,1000);
}
changeUrl();
//setInterval(‘changeUrl()‘,1000);
</script>
</body>
</html>
标签:no-repeat out type jquery timeout flow rip .com change
原文地址:http://www.cnblogs.com/lubenxin/p/7095899.html