[英]JavaScript: Horizontal Scrolling with Mouse Wheel
Based off this: http://reader-download.googlecode.com/svn/trunk/full-page-horizontal-scrolling.html I cannot for the life of me get it to work in IE 10 in either standards or Quirks mode. 基于此: http : //reader-download.googlecode.com/svn/trunk/full-page-horizontal-scrolling.html我不能为我的生活让它在标准或Quirks模式的IE 10中工作。 I have a jsFiddle here but it only scrolls vertical: http://jsfiddle.net/dwsRC/1/ 我这里有一个jsFiddle,但它只是垂直滚动: http : //jsfiddle.net/dwsRC/1/
The scrolling code is 100% the same as the example site. 滚动代码与示例站点100%相同。 I have tried other scrolling samples but preventDefault won't work. 我尝试过其他滚动示例,但preventDefault不起作用。 Adding jQuery doesn't help either. 添加jQuery也无济于事。
In Visual Studio 2012 I get: 在Visual Studio 2012中,我得到:
JavaScript runtime error: Object doesn't support property or method 'preventDefault' JavaScript运行时错误:对象不支持属性或方法'preventDefault'
HTML: HTML:
<div id="container">
<div class="content c1">Hello, World!</div>
<div class="content c2">Hello, World!</div>
<div class="content c3">Hello, World!</div>
<div class="content c1">Hello, World!</div>
<div class="content c2">Hello, World!</div>
<div class="content c3 last">Hello, World!</div>
</div>
CSS: CSS:
#container {
height: 100%;
width: 6000px;
overflow: hidden;
}
.content {
width: 895px;
height: 675px;
float:left;
margin-right:50px;
}
.c1 {
background-color: red;
}
.c2 {
background-color: blue;
}
.c3 {
background-color: green;
}
JS: JS:
(function () {
function scrollHorizontally(e) {
e = window.event || e;
var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
document.body.scrollLeft -= (delta * 40); // Multiplied by 40
e.preventDefault();
}
if (window.addEventListener) {
// IE9, Chrome, Safari, Opera
window.addEventListener("mousewheel", scrollHorizontally, false);
// Firefox
window.addEventListener("DOMMouseScroll", scrollHorizontally, false);
} else {
// IE 6/7/8
window.attachEvent("onmousewheel", scrollHorizontally);
}
})();
这个答案解决了我的问题,摆脱IE错误和水平滚动工作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.