1

我有一些事件侦听器，它适用于除 Firefox 中的鼠标滚轮之外的所有浏览器（在 Chrome 和其他浏览器中它运行良好）。当我滚动时它应该放大和缩小。它是 JSC3D 库。代码如下

// setup input handlers.
// compatibility for touch devices is taken into account
var self = this;
if(!JSC3D.PlatformInfo.isTouchDevice) {
    this.canvas.addEventListener('mousedown', function(e){self.mouseDownHandler(e);}, false);
    this.canvas.addEventListener('mouseup', function(e){self.mouseUpHandler(e);}, false);
    this.canvas.addEventListener('mousemove', function(e){self.mouseMoveHandler(e);}, false);
    //this.canvas.addEventListener('mousewheel', function(e){self.mouseWheelHandler(e);}, false);
    this.canvas.addEventListener(JSC3D.PlatformInfo.browser == 'firefox' ? 'DOMMouseScroll' : 'mousewheel', 
                                 function(e){self.mouseWheelHandler(e);}, false);
    document.addEventListener('keydown', function(e){self.keyDownHandler(e);}, false);
    document.addEventListener('keyup', function(e){self.keyUpHandler(e);}, false);
}
else if(JSC3D.Hammer) {
    JSC3D.Hammer(this.canvas).on('touch release hold drag pinch', function(e){self.gestureHandler(e);});
}
else {
    this.canvas.addEventListener('touchstart', function(e){self.touchStartHandler(e);}, false);
    this.canvas.addEventListener('touchend', function(e){self.touchEndHandler(e);}, false);
    this.canvas.addEventListener('touchmove', function(e){self.touchMoveHandler(e);}, false);
}

和功能JSC3D.Viewer.prototype.mouseWheelHandler：

JSC3D.Viewer.prototype.mouseWheelHandler = function(e) {
if(!this.isLoaded)
    return;

if(this.onmousewheel) {
    var info = this.pick(e.clientX, e.clientY);
    this.onmousewheel(info.canvasX, info.canvasY, e.button, info.depth, info.mesh);
}

e.preventDefault();
e.stopPropagation();

if(!this.isDefaultInputHandlerEnabled)
    return;

this.zoomFactor *= (JSC3D.PlatformInfo.browser == 'firefox' ? -e.detail : e.wheelDelta) < 0 ? 1.1 : 0.91;
this.update();
};

任何人？

4

2 回答 2

1 

if (this.addEventListener) {
	// IE9, Chrome, Safari, Opera
	this.addEventListener("mousewheel", MouseWheelHandler, false);
	// Firefox
	this.addEventListener("DOMMouseScroll", MouseWheelHandler, false);
}
// IE 6/7/8
else this.attachEvent("onmousewheel", MouseWheelHandler);

Firefox 使用 DOMMouseScroll 事件而不是鼠标滚轮

于 2015-10-21T07:57:07.347 回答
1

最尊重 jsc3d，但不是嗅探浏览器代理，我最好为此进行特征检测，例如：

if(!JSC3D.PlatformInfo.isTouchDevice) {
...
this.canvas.addEventListener('onwheel' in document ? 'wheel' : 'onmousewheel' in document ? 'mousewheel' : 'DOMMouseScroll', function(e){self.mouseWheelHandler(e);});
...
}

编辑： ...并使用相同的逻辑，还删除了对“firefox”的检查：

JSC3D.Viewer.prototype.mouseWheelHandler = function(e) {
...
    this.zoomFactor *= (e.deltaY ? e.deltaY : e.wheelDelta ? e.wheelDelta : e.detail) < 0 ? 1.1 : 0.91;
...
};

然后，你应该得到你的处理程序：

function OnViewerMouseWheeel(canvasX, canvasY, button, depth, mesh) {
    ...
}
viewer.onmousewheel=OnViewerMouseWheeel;

在最新的 FF 中测试，'onwheel' in document返回 true。

请让我知道这是否解决了问题。

于 2015-10-23T17:27:54.167 回答