禁止iOS的彈性滾動 微信的下拉回彈
一種方法:
html頭部添加
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
然后將頁面body的高度設為window的高度
$("body").height( $(window).height() );
其他方法
頁面高度超過設備可見高度時,阻止掉touchmove事件。
document.body.addEventListener('touchmove', function (event) {
event.preventDefault();
}, false);
/**
* 禁止瀏覽器下拉回彈
*/
function stopDrop() {
var lastY;//最后一次y坐標點
$(document.body).on('touchstart', function(event) {
lastY = event.originalEvent.changedTouches[0].clientY;//點擊屏幕時記錄最后一次Y度坐標。
});
$(document.body).on('touchmove', function(event) {
var y = event.originalEvent.changedTouches[0].clientY;
var st = $(this).scrollTop(); //滾動條高度
console.log("st = "+st);
if (y >= lastY && st <= 0) {//如果滾動條高度小於0,可以理解為到頂了,且是下拉情況下,阻止touchmove事件。
lastY = y;
event.preventDefault();
}
lastY = y;
//方法三
// var abc=$(document.body).scrollTop();
// console.log("abc = "+abc);
// if (abc>0) {
// $(document.body).scrollTop(0);
// }
});
}
stopDrop();