Scrolling a overflow:auto; element on android touch screen device
2013-01-06 17:05
295 查看
In mobile Safari on the iPhone, iPod Touch, and iPad (as well as the webkit based browser on Android phones) it's not immediately obvious how to scroll a div that has
overflow:auto;set on it. If this were a desktop browser you would see scrollbars and be able to manipulate those or even use your mouse wheel. No such concepts exist on a touch screen device!
function touchScroll(selector) { if (isTouchDevice()) { var scrollStartPosY=0; var scrollStartPosX=0; $(“body”).delegate(selector, ‘touchstart’, function(e) { scrollStartPosY=this.scrollTop+e.originalEvent.touches[0].pageY; scrollStartPosX=this.scrollLeft+e.originalEvent.touches[0].pageX; }); $(“body”).delegate(selector, ‘touchmove’, function(e) { if ((this.scrollTop < this.scrollHeight-this.offsetHeight && this.scrollTop+e.originalEvent.touches[0].pageY < scrollStartPosY-5) || (this.scrollTop != 0 && this.scrollTop+e.originalEvent.touches[0].pageY > scrollStartPosY+5)) e.preventDefault(); if ((this.scrollLeft < this.scrollWidth-this.offsetWidth && this.scrollLeft+e.originalEvent.touches[0].pageX < scrollStartPosX-5) || (this.scrollLeft != 0 && this.scrollLeft+e.originalEvent.touches[0].pageX > scrollStartPosX+5)) e.preventDefault(); this.scrollTop=scrollStartPosY-e.originalEvent.touches[0].pageY; this.scrollLeft=scrollStartPosX-e.originalEvent.touches[0].pageX; }); } }
相关文章推荐
- Android View.OnTouchListener 的子类,AutoScrollHelper,ZoomButtonsController,ListViewAutoScrollHelper
- TSLib ported to Android for touchscreen calibration. (转) [复制链接]
- Android中的dispatchTouchEvent()、onInterceptTouchEvent()和onTouchEvent()
- android获得控件在屏幕中的绝对坐标 getLocationInWindow 和 getLocationOnScreen
- android获得控件在屏幕中的绝对坐标 getLocationInWindow 和 getLocationOnScreen
- 两分钟彻底让你明白Android中onInterceptTouchEvent与onTouchEvent(图文)!
- Android中onInterceptTouchEvent与onTouchEvent(图文)!
- -webkit-overflow-scrolling:touch;
- Android中onInterceptTouchEvent与onTouchEvent
- Android中的dispatchTouchEvent()、onInterceptTouchEvent()和onTouchEvent()
- Android - onInterceptTouchEvent()与onTouchEvent()的区别
- android onInterceptTouchEvent和onTouchEvent
- webkit私有css3属性 -webkit-overflow-scrolling:touch;
- 两分钟彻底让你明白Android中onInterceptTouchEvent与onTouchEvent(图文)! 分类: Android基础教程
- Android中dispatchTouchEvent, onInterceptTouchEvent, onTouchEvent的详解
- Android View.setOnclickListener(),View.onTouchEvent(),View.setOnTouchListener()关系源码分析
- Android中的dispatchTouchEvent()、onInterceptTouchEvent()和onTouchEvent()
- 关于Android事件分发中onInterceptTouchEvent调用时机
- 两分钟彻底让你明白Android中onInterceptTouchEvent与onTouchEvent(图文)!
- linux 3.15.2 触摸屏移植之selected device is not a touchscreen I understand