我被要求为我们的页面网站实现ctrl + mousewheel事件,以便在用户放大或缩小时更改图像偏移。我找到了这个旧的答案Override browsers CTRL+(WHEEL)SCROLL with javascript,我试图这样做。 我为实现下载了jQuery Mouse Wheel Plugin,这是我的代码:
var isCtrl = false;
$(document).on('keydown keyup', function(e) {
if (e.which === 17) {
isCtrl = e.type === 'keydown' ? true : false;
}
}).on('mousewheel', function(e, delta) { // `delta` will be the distance that the page would have scrolled;
// might be useful for increasing the SVG size, might not
if (isCtrl) {
e.preventDefault();
alert('wheel');
}
});
事件可以单独运行,但是如果我按住CTRL按钮并转动鼠标,则轮子事件不会触发。 有没有人有更好的解决方案,或者我做错了什么? 谢谢你的帮助
答案 0 :(得分:8)
Fiddle,为了使其正常工作,您必须先在result
框中点击,然后再尝试。
$(window).bind('mousewheel DOMMouseScroll', function(event)
{
if(event.ctrlKey == true)
{
event.preventDefault();
if(event.originalEvent.detail > 0) {
console.log('Down');
}else {
console.log('Up');
}
}
});
答案 1 :(得分:1)
要检查是否点击了ctrl key
,该事件已经提供了一种方法。试试这个:
.on('mousewheel', function(e) {
if (e.ctrlKey) {
e.preventDefault();
alert('wheel');
}
});
这也适用于e.shiftKey
,e.altKey
等。我只会听滚动事件,我会检查ctrlKey
是否已关闭。