Android 版 Chrome 可以滚动 div 吗？

Question

这是可滚动 div 内的一段文本。

我可以在 Mac 版 Chrome 中用两根手指滚动它。我可以用一根手指在 iPad 上滚动它。但是，我找不到任何方法在 Android 版 Chrome 中滚动它。

也许有使用触摸 API 的解决方法？

Answer 1

Android 版 Chrome 的另一个快速修复 (http://chris-barr.com/index.html php/entry/scrolling_a_overflowauto_element_on_a_touch_screen_device/）

首先创建一个函数来检查它是否是触摸设备...

function isTouchDevice(){
  try {
    document.createEvent("TouchEvent");
    return true;
  } catch(e) {
    return false;
  }
}

then 函数使 div 可滚动

function touchScroll(id){
  if( isTouchDevice() ){ //if touch events exist...
    var el = document.getElementById(id);
    var scrollStartPos = 0;

    document.getElementById(id).addEventListener("touchstart", function(event){
      scrollStartPos = this.scrollTop + event.touches[0].pageY;
      event.preventDefault();
    }, false);

    document.getElementById(id).addEventListener("touchmove", function(event){
      this.scrollTop = scrollStartPos - event.touches[0].pageY;
      event.preventDefault();
    },false);
  }
}

...调用传递元素 id 的函数

touchScroll("divIdName");

Answer 2

在浏览有关此问题的错误报告时，我发现 这个 JavaScript 库 可以解决使用触摸事件的问题。据报道，它也已在 Honeycomb 中得到修复，因此希望人们在推出 Ice Cream Sandwich 版本后能够立即修复该问题。

Answer 3

3.0 之前的所有 Android 版本均存在溢出：滚动或自动错误（错误信息< /a>）。

对于那些使用 jQuery 的人来说，这里有一个快速修复：

function touchScroll(selector){
      var scrollStartPos = 0;
      $(selector).live('touchstart', function(event) {
        scrollStartPos = this.scrollTop + event.originalEvent.touches[0].pageY;
      });
      $(selector).live('touchmove', function(event) {
        this.scrollTop = scrollStartPos - event.originalEvent.touches[0].pageY;
      });
}

然后如果使用现代化：

if (Modernizr.touch) {
    touchScroll($('.myScrollableContent'))
}

但它并不理想，因为所有可触摸设备都会有这个。

如果您使用Phonegap，您可以执行以下操作（在phonegap初始化之后的某个位置）：

if (window.device && device.platform=="Android" && parseInt(device.version) < 3){
    touchScroll($('.myScrollableContent'))
}