您的位置:首页 > 其它

简单的幻灯效果

2015-06-15 10:26 302 查看
<body>

<style>

#test {width: 270px; height: 130px; overflow: hidden; border: 1px solid #333;}

#test a {display: block; width: 270px; height: 130px; text-align: center; background: #fff;}

#test a img {border: none;}

</style>

<div id="test">

<a href="#"><img src="http://proxy.xgres.com/thumbImg.php?w=150&h=110&u=http://u.img.huxiu.com/portal/201310/15/211243x02mqdqb31ubfmmm.png"
/></a>

<a href="#"><img src="http://proxy.xgres.com/thumbImg.php?w=150&h=110&u=http://img1.gtimg.com/news/pics/hv1/63/109/1439/93598833.jpg"
/></a>

<a href="#"><img src="http://proxy.xgres.com/thumbImg.php?w=150&h=110&u=http://a.36krcnd.com/photo/4c9bbc5bc8ecfaddb067d313edcd976e.jpg"
/></a>

</div>

<script language="javascript">

i=0;

function show() {

l=document.getElementsByTagName_r('a');

if (i<l.length-1){

l[i].style.display = "none";

i++;

}else {

for(a=0;a<l.length-1;a++){

l[a].style.display = "block";

i=0;

}

}

}

setInterval(show, 1000);

</script>

</body>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: