雅荷心语博客经常写的都是滚动条纵向滚动,今天遇到一个横向滚动的需求,查了一些资料,找到如下的结果办法~
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<script type="text/javascript"> /*********************** * 函数：判断滚轮滚动方向 * 作者：walkingp * 参数：event * 返回：滚轮方向 1：向上 -1：向下 *************************/ var scrollFunc=function(e){ var direct=0; e=e || window.event; if(e.wheelDelta){//IE/Opera/Chrome console.log(e.wheelDelta); }else if(e.detail){//Firefox if (e.detail > 0) { scrollGo(10); }else{ scrollGo(-10); } } } /*注册事件*/ if(document.addEventListener){ document.addEventListener('DOMMouseScroll',scrollFunc,false); }//W3C window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome/Safari </script> <!-- 滚动 --> <script type="text/javascript"> function scrollGo(value){ var width = $('body').width(); $('body').width($('body').width()+value); document.body.scrollLeft += value; document.documentElement.scrollLeft += value; } </script> |
