纠结的藤藤菜
2016-03-24 22:03
我的有三张图,每张图867像素,我的js代码是哪里写错了吗??
window.onload = function () {
var box = document.getElementById("box2");
var pic = document.getElementById('lunbo')
var botton = document.getElementsByClassName('bottons')
var prev = document.getElementById('prev')
var next = document.getElementById('next')
var sque = document.getElementsByClassName('on')
var index = 1;
var animated = false;
var timer;
function show() {
for (var i = 0; i < botton.lenth; i++) {
if (botton[i].className == 'onshow') {
botton[i].className = 'on';
break;
}
}
/*botton[index - 1].className = 'onshow';*/
}
function animate(offset) {
animated = true;
var newLeft = parseInt(pic.style.left) + offset + 'px';
var time = 1000;//时间
var inter = 10;//间隔
var speed = offset / (time / inter);
//平缓移动
function go() {
if ((speed < 0 && parseInt(pic.style.left) > newLeft) || (speed > 0 && parseInt(pic.style.left < newLeft))) {
pic.style.left = parseInt(pic.style.left) + speed + 'px';
setTimeout(go, inter);
}
else {
animated = false;
pic.style.left = newLeft + 'px';
if (newLeft > -867) {
pic.style.left = -1734 + 'px';
}
if (newLeft < -1734) {
pic.style.left = -867 + 'px';
}
}
}
pic.style.left = newLeft + 'px';
if (pic.style.left > -867) {
pic.style.left = -1734 + 'px';
}
if (newLeft < -1734) {
pic.style.left = -867 + 'px';
}
}
function play() {
timer = setInterval(function () {
next.onclick();
}, 3000);
}
next.onclick = function () {
if (index == 3) {
index = 1;
}
else {
index += 1;
}
show();
if (animated == false) {
animate(-867);
}
}
prev.onclick = function () {
if (index == 1) {
index = 3;
}
else {
index -= 1;
}
show();
if (animated == false) {
animate(867);
}
}
for (var i = 0; i < botton.length; i++) {
botton[i].onclick = function () {
if (this.className == 'onshow') {
return;
}
var myindex = parseInt(this.getAttribute('index'));
var offset = -867 * (myindex - index);
index = myindex;
show();
if (animated == false) {
animated(offset);
}
}
}
box.onmouseover = play;
}
var newLeft = parseInt(pic.style.left) + offset + 'px'; 把px去了下面才能比较大小
焦点图轮播特效
65279 学习 · 611 问题
相似问题
回答 2
回答 1