解决绝对定位层(position:absolute;)上无法触发滚动事件的问题

今天处理一个需求,页面的左边大部分内容被一个绝对定位的层给覆盖了,鼠标移动到右边滚动鼠标滚轮可以触发 浏览器滚动条,移动到右边却触发不了。



解决方法:在左边层增加监听事件,判断鼠标是向上滚,还是向下滚,然后触发你需要滚动的内容。

function getOs() { 
    if(navigator.userAgent.indexOf("MSIE")>0) return "MSIE"; 
    if(navigator.userAgent.indexOf("Firefox")>0) return "Firefox"; 
    if(navigator.userAgent.indexOf("Safari")>0) return "Safari"; 
    if(navigator.userAgent.indexOf("Camino")>0) return "Camino"; 
    if(navigator.userAgent.indexOf("Gecko/")>0) return "Gecko";   
}
u = $(".content");
$(".swf")[0].onmouseover = function(){
var len = 50;
        var p = this;
var isIE = getOs();
        if(isIE == "Firefox")
{
p.addEventListener("DOMMouseScroll",function(e){
e = window.event || e;
e.detail > 0 ? u.scrollTop(u.scrollTop()+len) : u.scrollTop(u.scrollTop()-len);
},false);
}
else
{
p.onmousewheel = function(){
event.wheelDelta > 0 ? u.scrollTop(u.scrollTop()-len) : u.scrollTop(u.scrollTop()+len);
}
}
};


评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值