[英]disable horizontal scrolling by finger swipe
This may just be a mac issue, but I have a page with an element which is twice the size of the page and is moved into view dynamically. 这可能只是一个mac问题,但我有一个页面,其元素是页面大小的两倍,并动态移动到视图中。 in my css I have overflow-x:hidden set so that this element won't create an ugly bottom scollbar, the problem is on my laptop (and probably on ipads and other devices) I can just swipe with two fingers to scroll and view this content.
在我的CSS中我有overflow-x:隐藏设置,这样这个元素就不会创建一个丑陋的底部scollbar,问题出在我的笔记本电脑上(可能在ipads和其他设备上)我可以用两根手指滑动滚动查看这个内容。 This breaks the whole layout and looks really bad, and I am looking for a way to completely disable this horizontal scrolling action with javascript or css.
这打破了整个布局,看起来非常糟糕, 我正在寻找一种方法来使用javascript或css完全禁用此水平滚动操作。
Thank you 谢谢
JavaScript: JavaScript的:
window.onscroll = function () {
window.scrollTo(0,0);
}
This will return the scroll bar back to it's original (0,0) location whenever the user tries to scroll. 每当用户尝试滚动时,这将使滚动条返回到其原始(0,0)位置。 Let me know if this works with a laptop pad as I am on a desktop.
如果我在桌面上使用笔记本电脑垫,请告诉我。
First I used a function to check when the scrolling had stopped. 首先,我使用一个函数来检查滚动停止的时间。 then i used another function to move back to the center.
然后我用另一个功能移回中心。
(function(){
var special = jQuery.event.special,
uid1 = 'D' + (+new Date()),
uid2 = 'D' + (+new Date() + 1);
special.scrollstart = {
setup: function() {
var timer,
handler = function(evt) {
var _self = this,
_args = arguments;
if (timer) {
clearTimeout(timer);
} else {
evt.type = 'scrollstart';
jQuery.event.handle.apply(_self, _args);
}
timer = setTimeout( function(){
timer = null;
}, special.scrollstop.latency);
};
jQuery(this).bind('scroll', handler).data(uid1, handler);
},
teardown: function(){
jQuery(this).unbind( 'scroll', jQuery(this).data(uid1) );
}
};
special.scrollstop = {
latency: 300,
setup: function() {
var timer,
handler = function(evt) {
var _self = this,
_args = arguments;
if (timer) {
clearTimeout(timer);
}
timer = setTimeout( function(){
timer = null;
evt.type = 'scrollstop';
jQuery.event.handle.apply(_self, _args);
}, special.scrollstop.latency);
};
jQuery(this).bind('scroll', handler).data(uid2, handler);
},
teardown: function() {
jQuery(this).unbind( 'scroll', jQuery(this).data(uid2) );
}
};
})();
jQuery(window).bind('scrollstop', function(e){
// block horizontal scrolling
window.scrollTo(0,jQuery(window).scrollTop());
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.