手机上使用positon:fixed定位,使用滚动条时,兼容性不好,所以自定义滑动事件
var dataScrol = {startY:0,endY:0,posY:0,maxScroll:1,isBind:false};
var scrollHandler = function (e) { e.preventDefault(); };
//禁用自定义滑动事件
document.addEventListener('touchmove', scrollHandler, false);
//dataScrol.posY = 0;
if(!dataScrol.isBind){
dataScrol.isBind = true;
var o_scroll = document.getElementById('orderDetailScroll');
var o_wrap = document.getElementById('orderDetailWrap');
dataScrol.maxScroll = o_wrap.scrollHeight - o_wrap.offsetHeight;
if (dataScrol.maxScroll == 0) return;
o_wrap.addEventListener('touchstart', function (e) {
dataScrol.startY = e.touches[0].pageY;
}, false);
o_wrap.addEventListener('touchmove', function (e) {
dataScrol.endY = e.touches[0].pageY;
var newY = dataScrol.posY + (dataScrol.endY-dataScrol.startY);
if(newY>0){
newY = 0;
}else if(newY<-dataScrol.maxScroll){
newY = -dataScrol.maxScroll;
}
dataScrol.posY = newY;
o_scroll.style.webkitTransform = 'translate(0,'+dataScrol.posY+'px)';
dataScrol.startY = dataScrol.endY;
}, false);
o_wrap.addEventListener('touchend', function (e) {
dataScrol.startY = 0; dataScrol.endY=0;
}, false);
}
//解除自定义事件
//document.removeEventListener('touchmove',scrollHandler,false);