我想为这个滚动条添加一个新的功能 通过按下鼠标来左右移动内容
<DIV id="scrollobj" style="white-space:nowrap;overflow:scroll;;width:400px;" onmouseover="stop()" onmouseout="move()"><span id="sp">这里是待着要滚动的内容全世界中国人都要万 </span></DIV>
<script language="javascript" type="text/javascript">
function scroll(obj) {
var zy = (obj.scrollLeft) ++;
//当滚动条到达右边顶端时
if (obj.scrollLeft == zy) obj.innerHTML += obj.innerHTML;
//当滚动条滚动了初始内容的宽度时滚动条回到最左端
if (obj.scrollLeft >= obj.firstChild.offsetWidth) obj.scrollLeft = 0;
}
var di = document.getElementById('scrollobj');
function move() {
gd = setInterval("scroll(di)", 50);
}
move();
function stop() {
clearInterval(gd);
}
</script>
原生js用onmousemove
事件绑定:http://www.w3school.com.cn/jsref/event_onmousemove.asp
jquery绑定move
类型事件即可。
楼上的回答只解决了鼠标移动的问题,还应该加上鼠标按键事件
思路是先绑定鼠标按下事件,回调函数绑定鼠标移动事件+鼠标按键松开事件,移动事件回调改变div颜色,松开事件回调设置onmousemove=null,即清除移动事件。
原生js:
onmousedown 按下
onmousemove 移动
onmouseup 松开
jQuery:
click 按下
mousemove 移动
mouseup 松开
参考资料:
1.jQuery事件:
http://www.w3school.com.cn/jquery/jquery_ref_events.asp
2.javascript事件:
http://www.w3school.com.cn/jsref/dom_obj_event.asp