top
元旦节到了,元旦节快乐...

固定当前背景  反馈、咨询、建议、留言等,请点这里[Alt+G]

本栏相关
其他文章
JavaScriptJavaScript当前位置:首页 >>开发技巧>>JavaScript
JS利用mousewheel插件实现鼠标滚动事件
编辑yang 发布时间2014-09-29 浏览量4443 来源本站编辑 特大
摘要:​鼠标滚动时返回的delta,向上滚动时值是:1,向下滚动时值是-1,所以很好判断。

       今天在做项目时,用到鼠标滚动的事件,发出来学习下。

       本实例需要引用mousewheel.js。

JS代码如下:

<script src="http://www.xcsoft.cn/Public/js/jquery.mousewheel.js"></script>
<script>
var sp=0;
$(document).mousewheel(function(event, delta, deltaX, deltaY) {
    if (delta > 0){
        //向上滚动事件
        if(sp>=-200){
        sp=sp-100;
        $("#list").css({"margin-left":sp+"px"});
        }
    }else if (delta < 0){
        //向下滚动事件
        if(sp<=200){
        sp+=100;
        $("#list").css({"margin-left":sp+"px"});
        }
    }
});
</script>

       鼠标滚动时返回的delta,向上滚动时值是:1,向下滚动时值是-1,所以很好判断。

标签  技巧网页制作

按键盘左右方向键可快速浏览上一篇(←)、下一篇(→)


反馈/咨询/建议/留言(GuestBook)
您好,怎么称呼您!
您的姓名:
上一步:鼠标向上滚动/左方向键(←)
下一步或完成:鼠标向下滚动/Tab键/右方向键(→)
如果您有空的话,可以填一下您的相关信息!
您的电话:
您的邮箱:
现在,请填写您想要了解的信息!
信息内容:
验证码: 看不清?点图片刷新