展开全部
===========================demo.html===========================
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>demo</title>
<script type="text/javascript" src="imageSwitcher.js"></script>
<script type="text/javascript">
window.onload = function() {
var is = new ImageSwitcher(document.getElementById("target-img"), [
"images/foo.jpg",
"images/bar.jpg"
]);
is.start(5000);
};
</script>
</head>
<body>
<img src="" id="target-img" />
</body>
</html>
=======================ImageSwiter.js========================
var ImageSwitcher = function(targetImg, images) {
this.targetImg = targetImg;
this.images = images;
if (!targetImg) {
this.targetImg = targetImg = document.createElement("img");
document.body.appendChild(targetImg);
}
};
ImageSwitcher.prototype = {
targetImg: null,
images: null,
currentImageIndex: 0,
timer: null,
start: function(interval) {
var self = this;
this.switchImage(0);
this.timer = setInterval(function(){
self.switchImage(++self.currentImageIndex);
}, interval);
},
stop: function() {
if (this.timer) {
clearInterval(this.timer);
this.timer = null;
}
},
switchImage: function(imageIndex) {
this.targetImg.src = this.images[imageIndex];
}
};
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>demo</title>
<script type="text/javascript" src="imageSwitcher.js"></script>
<script type="text/javascript">
window.onload = function() {
var is = new ImageSwitcher(document.getElementById("target-img"), [
"images/foo.jpg",
"images/bar.jpg"
]);
is.start(5000);
};
</script>
</head>
<body>
<img src="" id="target-img" />
</body>
</html>
=======================ImageSwiter.js========================
var ImageSwitcher = function(targetImg, images) {
this.targetImg = targetImg;
this.images = images;
if (!targetImg) {
this.targetImg = targetImg = document.createElement("img");
document.body.appendChild(targetImg);
}
};
ImageSwitcher.prototype = {
targetImg: null,
images: null,
currentImageIndex: 0,
timer: null,
start: function(interval) {
var self = this;
this.switchImage(0);
this.timer = setInterval(function(){
self.switchImage(++self.currentImageIndex);
}, interval);
},
stop: function() {
if (this.timer) {
clearInterval(this.timer);
this.timer = null;
}
},
switchImage: function(imageIndex) {
this.targetImg.src = this.images[imageIndex];
}
};
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询