JQ 最简单的切换图兼容IE6

最新推荐文章于 2018-02-06 17:58:42 发布

iteye_17658

最新推荐文章于 2018-02-06 17:58:42 发布

阅读量161

点赞数

分类专栏：境-JS 文章标签：切换图最简单的切换图兼容IE 太简单了

境-JS 专栏收录该内容

197 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>最简单的切换图</title>
<!--
兼容IE6+
兼容火狐
兼容谷歌
兼容欧朋
-->
</head>
<body>
<style>
*{ margin:0; padding:0;}
.banner{ width:200px; margin:40px auto 0 auto;}
</style>
<div class="banner">
<img src="img/a1.jpg" width="200" height="150" id="banner">
</div>
<script src="jquery-1.10.1.min.js"></script>
<script>
var imgIndex = 0;
var arr = ['a1.jpg', 'a2.jpg', 'a3.jpg'];
setInterval(imgChange, 4000);
function imgChange() {
imgIndex == (arr.length - 1) ? imgIndex = 0 : imgIndex += 1;
$("#banner").attr('src','img/' + arr[imgIndex]); 
}
</script>
</body>
</html>

效果图：