如何为 iOS 和平板电脑设置 $.Scroll？答案

【问题标题】：How do I set the $.Scroll for iOS and Tablets?如何为 iOS 和平板电脑设置 $.Scroll？
【发布时间】：2012-04-04 04:41:51
【问题描述】：

我正在尝试使用 jQuery / JavaScript 设置滚动。我无法弄清楚如何使用 iOS 和平板电脑的视口。任何帮助将不胜感激。我需要将 $.Scroll 用于设计/动画目的。

谢谢，

这是我目前所拥有的：



    var isIphone = navigator.userAgent.match(/iPhone/i) != null;
    var isIpod = navigator.userAgent.match(/iPod/i) != null;
    var isIpad = navigator.userAgent.match(/iPad/i) != null;

    // now set one variable for all iOS devices
    // What do I do for Tablet PC's?

    var isIos = isIphone || isIpod || isIpad;

    jQuery(function ($) {
      $.Window = $(window); // We'll use this later on 
      $.Body = $('body');
      if ( !isIos ) {
        // Ternary for desktop
        $.Scroll = ($.browser.mozilla || $.browser.msie) ? $('html') : $.Body;
      } else {
        // Need to detect iOS and Tablet PC's
        $.Scroll = $.Body;
      }
    });

更新：

感谢您迄今为止的意见！

我已经弄清楚如何访问 iOS 触摸事件：



    $.Window
      .bind('touchmove',
        function (e) {
          //code goes here
      })
      .bind('scroll',
        function (e) {
          //code goes here
      })

这似乎对滚动和触摸事件都有效。

【问题讨论】：

您的意思是使用“scrollTop(value)”(api.jquery.com/scrollTop)？什么是“$.Scroll”？插件？看起来您正在设置进行滚动的元素；我没见过这样的。
我正在创建一个名为 $.Scroll 的对象来帮助定义 scrollTop 的位置。我认为问题在于 iOS 似乎没有将 $('html') 或 $('body') 识别为 scrollTop 的对象，如果将 scrollTop 用作 .animate 属性，则会导致没有动画。
我尝试使用 $.Body 对象，它可以工作，但确实不稳定。我听说 jQuery scrollTop() 在 iOS 上是错误的，这是正确的吗？
我真正想做的是使用触摸滚动事件，但我找不到这个对象的名称。

标签： javascript jquery ios cross-browser tablet

【解决方案1】：

iOS 会在滚动时停止计时器，因此在大多数情况下，基于计时器的动画将无法正常工作。我的滚动很好，只是 jQuery .animate 不适用于 iOS Safari 的滚动类型实现。

【讨论】：

【解决方案2】：

我认为 window.scrollTo(x, y) 会得到你想要的，但你需要确保窗口实际上是可滚动的（即内容大于窗口并且正文溢出是可滚动的）。

旁注：我还没有看到有人像这样在 jQuery 库中存储变量。为什么不直接做var scrollableObject = ($.browser.mozilla || $.browser.msie) ? $('html') : $.Body;？

【讨论】：