<div id="Parent"
style="cursor: hand; overflow: hidden; width: 800px; height: 50px">
<div id="Child_A" style="float: left; white-space: nowrap;">
<img src="" style="width: 50px; height: 50px;">
<img src="" style="width: 50px; height: 50px;">
|
</div>
</div>
<input type="button" value="stop" οnclick="aa.stop()">
<input type="button" value="left" οnclick="aa.left()">
<input type="button" value="right" οnclick="aa.right()">
//js控制图片移动(marquee无空白左右移动)
<script type="text/javascript">
function Marque() {//js封装类
Marque.prototype.Parent = document.getElementById("Parent");
Marque.prototype.ChildA = document.getElementById("Child_A");
Marque.prototype.parentWidth = Marque.prototype.Parent.offsetWidth;
Marque.prototype.count = 2;
Marque.prototype.ChildA.innerHTML = Marque.prototype.ChildA.innerHTML + " " + Marque.prototype.ChildA.innerHTML;
while (Marque.prototype.Parent.scrollWidth <= Marque.prototype.parentWidth) {
Marque.prototype.count *= 2;
Marque.prototype.ChildA.innerHTML = Marque.prototype.ChildA.innerHTML + " " + Marque.prototype.ChildA.innerHTML;
}
Marque.prototype.speed = 10;
Marque.prototype.flag = "stop";
Marque.prototype.Marqueeleft = function () {
if (Marque.prototype.ChildA.offsetWidth / Marque.prototype.count - Marque.prototype.Parent.scrollLeft <= 0) {
Marque.prototype.Parent.scrollLeft -= Marque.prototype.ChildA.offsetWidth / Marque.prototype.count;
} else {
Marque.prototype.Parent.scrollLeft++;
}
};
Marque.prototype.Marqueeright = function () {
if (Marque.prototype.Parent.scrollLeft <= 0) {
Marque.prototype.Parent.scrollLeft = Marque.prototype.Parent.scrollLeft + Marque.prototype.ChildA.offsetWidth / Marque.prototype.count;
} else {
Marque.prototype.Parent.scrollLeft--;
}
};
Marque.prototype.Myleft = "";
Marque.prototype.Myright = "";
Marque.prototype.stop = function () {
if (Marque.prototype.flag == "stop") {
return true;
}
if (Marque.prototype.flag == "right") {
clearInterval(Marque.prototype.Myright);
Marque.prototype.flag = "stop";
return true;
}
if (Marque.prototype.flag == "left") {
clearInterval(Marque.prototype.Myleft);
Marque.prototype.flag = "stop";
return true;
}
};
Marque.prototype.left = function () {
if (Marque.prototype.flag == "stop") {
Marque.prototype.Myleft = setInterval(Marque.prototype.Marqueeleft, Marque.prototype.speed);
Marque.prototype.flag = "left";
return true;
}
if (Marque.prototype.flag == "right") {
clearInterval(Marque.prototype.Myright);
Marque.prototype.Myleft = setInterval(Marque.prototype.Marqueeleft, Marque.prototype.speed);
Marque.prototype.flag = "left";
return true;
}
if (Marque.prototype.flag == "left") {
return true;
}
};
Marque.prototype.right = function () {
if (Marque.prototype.flag == "stop") {
Marque.prototype.Myright = setInterval(Marque.prototype.Marqueeright, Marque.prototype.speed);
Marque.prototype.flag = "right";
return true;
}
if (Marque.prototype.flag == "right") {
return true;
}
if (Marque.prototype.flag == "left") {
clearInterval(Marque.prototype.Myleft);
Marque.prototype.Myright = setInterval(Marque.prototype.Marqueeright, Marque.prototype.speed);
Marque.prototype.flag = "right";
return true;
}
};
}
var aa=new Marque();
var aa=new Marque();
</script>