无缝轮播图

2017-10-07  本文已影响0人  乍暖还寒2002

向左走向右走

window.onload = function(){

// var div1 = document.getElementById('div1');

// setInterval(function(){

// div1.style.left = div1.offsetLeft + 14 + 'px';

// },100)

var oDiv = document.getElementById('div1');

var oUl = document.getElementsByTagName('ul')[0];

var aLi = document.getElementsByTagName('li');

var speed = -4;//控制速度

var timer;//计时器变量

oUl.innerHTML += oUl.innerHTML;//复制了一份

oUl.style.width = aLi[0].offsetWidth * aLi.length + 'px';//计算ul的寛

function move(){

if (oUl.offsetLeft < -oUl.offsetWidth/2) {

oUl.style.left = '0';

}

if(oUl.offsetLeft > 0){

oUl.style.left = -oUl.offsetWidth/2 + 'px';

}

oUl.style.left = oUl.offsetLeft + speed + 'px';//每100毫秒向右移动-4px

}

timer = setInterval(move,100)

div1.onmouseover = function(){

clearInterval(timer);

}

div1.onmouseout = function(){

timer = setInterval(move,100);

}

document.getElementsByTagName('a')[0].onclick = function(){

speed=-4;

}

document.getElementsByTagName('a')[1].onclick = function(){

speed=4;

}

}

上一篇 下一篇

猜你喜欢

热点阅读