阻止窗体滑动

标签：默认   selector   ati   垂直   htm   滑动   标记   ide   默认事件   url: http://www.zhangxinxu.com/study/201612/mobile-scroll-prevent-window-scroll.html.noscroll, .noscroll body { overflow: hidden; } .noscroll body { position: relative; } 然后，当浮层出现的时候： $(‘html‘).addClass(‘noscroll‘); 当浮层隐藏的时候： $(‘html‘).removeClass(‘noscroll‘); 可以让一部分浏览器的窗体不能滚动，但不包括Safari等浏览器，怎么办呢？ 我们可以在浮层touchmove的时候，阻止默认事件达到避免滚动的问题，例如： $(‘aside‘).on(‘touchmove‘, function(event) { event.preventDefault(); }); CSS代码： .noscroll, .noscroll body { overflow: hidden; } .noscroll body { position: relative; } JS代码： $.smartScroll = function(container, selectorScrollable) { // 如果没有滚动容器选择器，或者已经绑定了滚动时间，忽略 if (!selectorScrollable || container.data(‘isBindScroll‘)) { return; } // 是否是搓浏览器 // 自己在这里添加判断和筛选 var isSBBrowser; var data = { posY: 0, maxscroll: 0 }; // 事件处理 container.on({ touchstart: function (event) { var events = event.touches[0] || event; // 先求得是不是滚动元素或者滚动元素的子元素 var elTarget = $(event.target); if (!elTarget.length) { return; } var elScroll; // 获取标记的滚动元素，自身或子元素皆可 if (elTarget.is(selectorScrollable)) { elScroll = elTarget; } else if ((elScroll = elTarget.parents(selectorScrollable)).length == 0) { elScroll = null; } if (!elScroll) { return; } // 当前滚动元素标记 data.elScroll = elScroll; // 垂直位置标记 data.posY = events.pageY; data.scrollY = elScroll.scrollTop(); // 是否可以滚动 data.maxscroll = elScroll[0].scrollHeight - elScroll[0].clientHeight; }, touchmove: function () { // 如果不足于滚动，则禁止触发整个窗体元素的滚动 if (data.maxscroll