Question

JS图片滚动怎么让鼠标经过后停止啊？

JS图片滚动怎么让鼠标经过后停止啊？

Answer 1

我写的代码，要下班了，所以就简单注释一下。鼠标经过会停止，移开鼠标会继续走。已经测试过了。另存xx.htm打开可看效果。

<script type="text/javascript">
var timer_movex;
start_timer();

function start_timer(){
  timer_movex = setInterval(function() {//setInterval是js循环定时器每隔一段时间就执行一次function代码
  var x = document.getElementById('x');//获得id为x的html元素
  if(x.offsetLeft >= 800)
    x.style.left = 0;//如果移动到了800的位置，则跳回左边0点重新开始移动
  else
    x.style.left = x.offsetLeft + 50;//向右移动20个像素
}, 1000);//每隔1000毫秒移动一次
}

function stop_timer() {
  clearInterval(timer_movex);
}

function movex(v) {
  var x = document.getElementById('x');//获得id为x的html元素
  x.style.left = x.offsetLeft + v;//移动v个像素，v为正数则向右，负数则向左。x.style.left即为左边框位置。
}
</script>
<div id="x" style="position:absolute; left:500px; top:100px; width:100px; height:100px; border=1px solid #000;" onmouseover="stop_timer()" onmouseout="start_timer()">
<h1>TEST</h1>
</div>
<form>
<input id="test" onclick="movex(-100)" value="点击左移" type="button"/>
<input id="test" onclick="movex(100)" value="点击右移" type="button"/>
<input id="test" onclick="start_timer()" value="start" type="button"/>
<input id="test" onclick="stop_timer()" value="stop" type="button"/>
</form>

Answer 2

鼠标移上去的时候 把滚动事件停止掉 离开的时候又恢复就好了。最好你把你的代码发上来。