鼠標滾輪事件不會觸發了身體在Chrome

我已經注意到了鼠標滾輪使用全身，而不是通過使用最新版本的Chrome的任何其他元素時鼠標滾輪時不會觸發事件。（38.0.2125.104米）。鼠標滾輪事件不會觸發了身體在Chrome

使用絕對定位元素時會發生這種情況。

您可以在this fiddle中通過滾動白色區域而不是紅色區域來重現它。

任何想法爲什麼會發生這種情況？任何解決方案？對於小提琴

使用的代碼：

addMouseWheelHandler(); 

function addMouseWheelHandler() { 
    if (document.addEventListener) { 
     document.addEventListener("mousewheel", MouseWheelHandler, false); //IE9, Chrome, Safari, Oper 
     document.addEventListener("wheel", MouseWheelHandler, false); //Firefox 
    } else { 
     document.attachEvent("onmousewheel", MouseWheelHandler); //IE 6/7/8 
    } 
} 



function MouseWheelHandler(e) { 
    e = window.event || e; 

    var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.deltaY || -e.detail))); 
    console.log("mouse wheel!" + delta); 

    return false; 
}

來源

2014-10-20 Alvaro

這似乎是一個錯誤更改內容。事件監聽器被附加到文檔中，所以它應該適用於整個文檔，而不管body元素的高度。

作爲變通，您可以添加以下代碼：

document.body.style.height= document.body.scrollHeight+'px';

來源

2014-10-20 19:09:09

警告：看document.body.scrollHeight因爲改變不是微不足道的。我在體內添加了一個包裝元素並觀察該元素上的鼠標滾輪，取得了較好的成功。 – ryascl 2015-07-21 13:55:03

這是因爲你的身體有沒有高度，所以你滾動的文檔之外。如果孩子是絕對定位的，父元素不會擴大到它的孩子的大小。嘗試添加這樣的事情：

html, body { 
    min-height: 2000px; 
}

或position: absolute;

來源

2014-10-20 16:52:38

這聽起來不像是最好的解決辦法，它會增加滾動區域... – Alvaro 2014-10-20 21:18:06

鼠標滾輪事件不會觸發了身體在Chrome

回答

相關問題