Javascript IE 9、10：部门结构和事件

我有一个不太复杂的

结构，它打破了IE<11中的事件处理程序（其他主要浏览器如Chrome和Firefox正在工作）

以下是已注册的事件处理程序：

$（函数（）{
var stopPropagation=函数（e）{
e、 停止传播（）；
e、 预防默认值（）；
e、 停止即时复制（）；
}
$（'#controller'）。on（'mousedown'，函数（e）{
log（'controller mousedown'）；
});
$（“#控件”）。在（'mouseweel'，函数（e）上{
console.log（“控制鼠标滚轮”）；
停止传播（e）；
返回false；
});
$（“#thumbnailer”）。在（'click'，函数（e）上{
log（'thumbnailer clicked'）；
});
$（'#viewArea'）。在（'单击'）上，函数（e）{
console.log（'viewareaclick'）；
停止传播（e）；
返回false；
});
$（'#viewArea'）。on（'mousedown'，函数（e）{
console.log（'viewareamousedown'）；
停止传播（e）；
返回false；
});
$（“#滑块”）。在（'change'，函数（e）上{
log（'sliderchange'）；
停止传播（e）；
返回false；
});
});

主要问题似乎是CSS定位和大小：

#层{
位置：绝对位置；
顶部：-175.813008130081px；
左：-578.615px；
宽度：1421px；
身高：875px；
}
#第1层，#第1层img{
位置：绝对位置；
排名：0；
左：0；
宽度：100%；
身高：100%；
}
#控制{
位置：绝对位置；
顶部：0px；
左：0px；
宽度：100%；
身高：100%；
}
#拇指钉{
背景色：rgba（150,150,150,0.7）；
边框：1px实心rgb（150150150）；
位置：绝对位置；
底部：15px；
右：10px；
宽度：200px；
高度：123px；
}
#指钉器{
宽度：100%；
身高：100%；
}
#视域{
位置：绝对位置；
顶部：25px；
左：81px；
边框：1px实心#f00；
宽度：56%；
身高：56%；
}
#控制器{
宽度：100%；
身高：100%；
}
#滑块{
位置：绝对位置；
底部：10px；
左：200px；
}

在IE<11中，

viewArea

上的任何单击或

mousedown

保持未处理状态；相反，将触发

thumbnailer

上的事件。类似地，

controls上的
mouseweel
事件和
controller上的
mousedown
也没有得到处理。但是，当光标位于
滑块
元素上时，
鼠标滚轮
事件get将被触发

这种奇怪的行为似乎根源于这两幅图像的大小。但是，我的应用程序需要在一个相对较小的容器中显示较大的图像（因此
overflow:hidden
set）

我为此创建了一个。问题似乎是IE<11不会触发空
上的事件。添加透明的