如何防止Mousewheel事件的默認操作

我正在構建一個d3.js條形圖，它允許我通過用固定寬度包裝svg元素並在具有溢出屬性的較小div內高度滾動x軸。該可視化工具正在構建在處理數據的平臺上，並提供了一個用於創建可視化的JavaScript代碼編輯器。發佈代碼後，條形圖將在html div元素中呈現。如何防止Mousewheel事件的默認操作

條形圖獲取呈現的頁面有一個默認的縮放事件，當您使用鼠標滾輪時會觸發。因爲我想通過使用鼠標滾輪，我試圖從射擊通過停止默認縮放動作在我的條形圖滾動包含在代碼下面的語句：

$(vizhtmlelement).mousewheel(function() { 
    return false; 
});

這成功地工作在消除變焦功能，但它也可以防止使用鼠標滾輪進行滾動。有沒有辦法阻止鼠標滾輪變焦，同時保持鼠標滾輪在我的可視化中？

來源

2013-10-25 user2921383

你在找'event.preventDefault（）;' –

在你的.call（）縮放函數的任何元素上，你需要設置它的鼠標滾輪行爲爲null。所以，如果你從一個或「yourElement」的ID .CALL（變焦），那麼它應該是這樣的：

d3.select("#yourElement") 
.call(myZoom) 
.on("dblclick.zoom", null) 
.on("mousewheel.zoom", null) 
.on("DOMMouseScroll.zoom",null);

通知我還禁用了雙擊縮放，因爲你可能會想，殘疾以及。

來源

2013-10-26 04:07:22 Elijah

嗨以利亞，謝謝你的回覆。不幸的是，不能控制縮放功能。它已在整個頁面上默認調用。 – user2921383

它是如何在代碼中調用的？ – Elijah

據我所知，backbone.js正在被使用，並且在其中一個initialize（）屬性中，調用了一個函數zoomHammer：'this._zoomHammer = this。$ content.zoomHammer（this.options）.data 「zoomHammer」）;'。這個zoomHammer函數有如下一行：'el.data（'zoomHammer'，new Zoomable（this，options || {}））;'。然後，Zoomable函數調用一個啓用函數，該函數包含：'this。$ root（）。on（'mousewheel'，function（ev，delta）{ev.preventDefault（）; ）return instance._handleWheel（ev，delta） }）;' – user2921383

如何防止Mousewheel事件的默認操作

回答

相關問題