垂直滚动在 iOS 上不起作用，但在 Android 上运行良好

Posted 2023-03-15

【中文标题】垂直滚动在 iOS 上不起作用，但在 Android 上运行良好

【英文标题】：Vertical Scroll Doesn't work on iOS but works good on Android

【发布时间】：2019-03-05 10:03:44

【问题描述】：

我有一个使用 Framework7 开发的 cordova 应用程序。垂直滚动在任何页面上都不起作用！

页面结构是

<div class="page" data-name="new-contact">
   <div class="navbar">
      <div class="navbar-inner sliding">
         <div class="left"><a href="#" class="link back"><i class="icon ion-ios-arrow-back"></i></a></div>
         <div class="title">Contact</div>
      </div>
   </div>
   <div class="page-content story-content" id="add-contact-content">
      <div class="block">
         <form id="contact-form" class="form-ajax-submit" enctype="multipart/form-data">
            <h1>Contact</h1>
            <div class="light-input story-input-focus no-icon-input"><input type="text" maxlength="231" id="reason" name="reason" placeholder="Reason"></div>
            <textarea class="light-input story-input-focus story-description-input" id="description" name="description" placeholder="Description"></textarea>
            <div id="add-contact" class="link red-button">Submit</div>
         </form>
      </div>
   </div>
</div>

并且 page-content 类的内容比视口长。我尝试为溢出、溢出-x 和溢出-y 添加自动/滚动。但没有任何效果。

它在 android 甚至 iOS 中都能完美运行，水平滚动也能正常工作，在左侧菜单面板中，垂直滚动也能正常工作！

【参考方案1】：

我在您提供的代码中找不到任何会阻止滚动的内容。它必须在您的页面元素之外。

【参考方案2】：

这是因为我使用hammerjs 对父div 进行滑动手势！终于修好了！ :')