在CTRL + MOUSEWHEEL事件 [英] On CTRL+MOUSEWHEEL event

问题描述

我被要求为我们的页面网站实现ctrl + mousewheel事件，以便在用户放大或缩小时更改图像偏移。我发现这个旧答案用javascript覆盖浏览器CTRL +（WHEEL）SCROLL 和我`试图做同样的事情。
我为实现下载了 jQuery Mouse Wheel Plugin ，这是我的代码：

I was asked to implement ctrl+mousewheel event for our page site in order to change image offset on user zoom in or zoom out. I found this old answer Override browsers CTRL+(WHEEL)SCROLL with javascript and I`ve tried to do the same. I downloaded the jQuery Mouse Wheel Plugin for the implementation and here is my code:

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按钮并转动鼠标滚轮事件不开火。
有没有人有更好的解决方案，或者我做错了什么？
感谢您的帮助

The events works fine separately, but if I hold the CTRL button and wheel the mouse the wheel event does not fire. Does any one have better solution for this or may be I did something wrong? Thanks for help

推荐答案

小提琴，为了让它起作用，你必须先尝试点击结果框。

Fiddle, In order for it to work you have to click in the result box first before trying.

$(window).bind('mousewheel DOMMouseScroll', function(event) 
{
    if(event.ctrlKey == true)
    {
        event.preventDefault();
        if(event.originalEvent.detail > 0) {
             console.log('Down');
         }else {
             console.log('Up');
         }
    }
});

这篇关于在CTRL + MOUSEWHEEL事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！