前段实现两个图片轮播

2019-04-15 15:58发布

站内文章 / PIC单片机
17271 0 1543
window.onload = function () { // 1.获取标签 var oPicDiv = document.getElementById("pic"), oList = document.getElementById("list"), oPicDiv1 = document.getElementById("pic1"), oList1 = document.getElementById("list1"); // 添加两份的内容复制网页 oList1.innerHTML = oList1.innerHTML + oList1.innerHTML; oList.innerHTML = oList.innerHTML + oList.innerHTML; // 2.默认左边滚动: left var iLeft = 0;// 位置 var iPosition = -1;// 方向 function fnAnimation() { iLeft += iPosition; //判断切换 if (iLeft < -1000) { iLeft = 0; } if (iLeft > 0) { iLeft = -1000; } oList.style.left = iLeft + "px"; oList1.style.left = iLeft + "px"; console.log("定时器一直在走"); } var timer = setInterval(fnAnimation,35); // 4.监听鼠标 oPicDiv.onmouseover = function () { //干掉计时器 clearInterval(timer); } // 鼠标移开 动画开始 oPicDiv.onmouseout = function () { // 重新开启 timer = setInterval(fnAnimation,35); } oPicDiv1.onmouseover = function () { // 干掉计时器 clearInterval(timer); } // 鼠标移开 动画开始 oPicDiv1.onmouseout = function () { // 重新开启 timer = setInterval(fnAnimation, 35); } }

热门文章