草庐IT

javascript - 网站经常拒绝在 iPhone (Safari) 上滚动

coder 2023-08-04 原文

出于某种原因，我的网站经常拒绝滚动，但仅限于 iPhone。

可以工作的设备/浏览器:

  • iPad( Safari )
  • Android 手机(Chrome)
  • PC(Chrome(包括 DevTools 仿真)和 IE11)

显示错误的设备:

  • iPhone 4S
  • iPhone 5
  • iPhone 6

很明显它与 iPhone 相关。就像只有在 iPhone 上滚动时超时。我会尽可能详细地描述错误。

加载网站后，我必须等待大约 5 秒才能滚动。然后我向下滚动一点。在滚动过程中，可以看到滚动条(正常)。当滚动条消失时，相反 方向的滚动将被阻止大约 5 秒。当我滚动并向相反方向滚动时，在滚动条消失之前，它会按预期滚动。

此外，当我想更改滚动方向时，就好像我必须滑动两次才能“初始化”滚动。我必须滚动、等待、滚动才能实际滚动那个方向。

所以:

  • 向下滚动 (scrolls)，等待，向下滚动 (scrolls) - 同向滚动
  • 向上滚动 (scrolls)，等待，向上滚动 (scrolls) - 同向滚动
  • 向下滚动 (scrolls)，向上滚动 (scrolls) - 在滚动条消失之前改变方向
  • 向下滚动(滚动)，等待，向上滚动(无)-改变方向
  • 向下滚动(滚动)，等待，向上滚动(无)，等待，向上滚动(滚动)- 改变方向，必须滚动并等待两次

在 wait 处，我等了 3 秒。如果我在相反方向滚动时等待的时间不够长，它就不会滚动。

该网站使用 MeteorJS 和 jQuery。我试过一些移动实用程序脚本，比如 iScroll和 FastClick , 但他们似乎没有帮助。

最佳答案

编辑:我已经与 Apple 谈过这个错误。他们承认它的存在，但决定暂时不优先考虑它。如果这个错误伤害了你，请评论 https://bugs.webkit.org/show_bug.cgi?id=169509 .

错误是什么:

只有当您到达滚动层的开始/结束，然后您的下一个手势的开始方向相同时，才会出现问题。然后 webkit wheel 事件决定它不能那样做并且根本不允许你滚动。

有一个解决方法:永远不要让滚动层到达滚动的开始或结束!

div.addEventListener('scroll',() =>
    div.scrollTop = Math.max(1, Math.min(div.scrollTop,
                                         div.scrollHeight - div.clientHeight - 1));
);

我希望一些仍然参与 webkit 的人可以解决这个问题(我已经从浏览器代码中退休了)，它在 ios 上无处不在伤害可滚动层。

关于javascript - 网站经常拒绝在 iPhone (Safari) 上滚动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29531718/

javascriptiPhonestrong滚动sectionhtmlcss

有关javascript - 网站经常拒绝在 iPhone (Safari) 上滚动的更多相关文章

  1. ruby - Ping ruby 网站？ - 2

    在Ruby中可以使用哪些替代方法来ping一个ip地址？标准库“ping”库的功能似乎非常有限。我对在这里滚动我自己的代码不感兴趣。有没有好的gem？我应该接受它并忍受它吗？(我在Linux上使用Ruby1.8.6编写代码) 最佳答案 net-ping值得一看。它允许TCPping(如标准ruby​​ping)，但也允许UDP、HTTP和ICMPping。ICMPping需要root权限，但其他则不需要。 关于ruby-Pingruby网站？，我们在StackOverflow上找到一个类

  2. ruby - rbenv 安装权限被拒绝 - 2

    大家好，我正在尝试设置一个开发环境，并且我一直在关注以下教程:Linktotutorial我做得不是很好，除了最基本的版本控制内容外，我对终端命令没有任何实际经验。我点击了第一个链接并尝试运行source~/.bash_profile我得到了错误；mkdir:/usr/local/rbenv/shims:权限被拒绝mkdir:/usr/local/rbenv/versions:权限被拒绝现在每次我加载终端时都会出现错误。bash_profile的内容；exportPATH=/usr/local/rbenv/bin:$PATHexportRBENV_ROOT=/usr/local/rbe

  3. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  4. ruby - rbenv:权限被拒绝 - 2

    我正在关注Ryan的RailsCast第339集。我已经安装了rbenv并且可以运行ruby-v。我退出了我的session，当我试图返回时(通过root的sudeployer，我得到了这个错误/home/deployer/.rbenv/bin/rbenv:line20:cd:/root:Permissiondenied这是rbenv文件:#!/usr/bin/envbashset-e[-n"$RBENV_DEBUG"]&&set-xresolve_link(){$(type-pgreadlinkreadlink|head-1)"$1"}abs_dirname(){localcwd="

  5. ruby - 使用 Ruby 和 Mechanize 登录网站 - 2

    我需要从站点抓取数据，但它需要我先登录。我一直在使用hpricot成功地抓取其他网站，但我是使用mechanize的新手，我真的对如何使用它感到困惑。我看到这个例子经常被引用:require'rubygems'require'mechanize'a=Mechanize.newa.get('http://rubyforge.org/')do|page|#Clicktheloginlinklogin_page=a.click(page.link_with(:text=>/LogIn/))#Submittheloginformmy_page=login_page.form_with(:act

  6. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  7. 网站日志分析软件--让网站日志分析工作变得更简单 - 2

    网站的日志分析，是seo优化不可忽视的一门功课，但网站越大，每天产生的日志就越大，大站一天都可以产生几个G的网站日志，如果光靠肉眼去分析，那可能看到猴年马月都看不完，因此借助网站日志分析工具去分析网站日志，那将会使网站日志分析工作变得更简单。下面推荐两款网站日志分析软件。第一款：逆火网站日志分析器逆火网站日志分析器是一款功能全面的网站服务器日志分析软件。通过分析网站的日志文件，不仅能够精准的知道网站的访问量、网站的访问来源，网站的广告点击，访客的地区统计，搜索引擎关键字查询等，还能够一次性分析多个网站的日志文件，让你轻松管理网站。逆火网站日志分析器下载地址：https://pan.baidu.

  8. ruby-on-rails - 从带有 ruby​​ on rails 的网站获取 html - 2

    如何使用ruby​​onrails获取网络上某处其他网站的页面数据？ 最佳答案 您可以使用httparty只是获取数据示例代码(来自example):requireFile.join(dir,'httparty')require'pp'classGoogleincludeHTTPartyformat:htmlend#google.comredirectstowww.google.comsothisislivetestforredirectionppGoogle.get('http://google.com')puts'','*'*7

  9. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  10. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

随机推荐