程序员经验分享-hwhale

iOS 15 safari 工具栏现在在元素内滚动时隐藏

2024-02-07

在 iOS 15 上，无论您有顶部还是底部工具栏，在元素内滚动都会导致窗口调整大小/工具栏消失。在 iOS 14 上，只有当主体滚动时才会发生这种情况。请参阅下面的 gif，注意 - 黄色区域是一个带有溢出滚动的 div，并且主体不滚动。

iOS 15

iOS 14

代码示例在这里：https://codesandbox.io/s/ios15-scroll-example-u7toi https://codesandbox.io/s/ios15-scroll-example-u7toi

这种新行为是有意为之还是一个错误？有什么方法可以禁用它，因为它让很多网站现在看起来有点奇怪！


我为我的案例解决了这个问题。也许它也会对你有帮助。

身体滚动锁定库https://github.com/willmcpo/body-scroll-lock https://github.com/willmcpo/body-scroll-lock

工作视频示例

使用库之前（痛苦）：https://truewebstories.ru/sites/default/files/0my_files/blog/2022/scroll-safari-15/before.MP4 https://truewebstories.ru/sites/default/files/0my_files/blog/2022/scroll-safari-15/before.MP4

After: https://truewebstories.ru/sites/default/files/0my_files/blog/2022/scroll-safari-15/after.MP4 https://truewebstories.ru/sites/default/files/0my_files/blog/2022/scroll-safari-15/after.MP4

打开菜单后，我会阻止除“汉堡菜单”（侧面菜单）之外的所有内容滚动。当菜单关闭时，所有滚动锁都会被释放。

谢谢威尔姆波https://github.com/willmcpo https://github.com/willmcpo还有谷歌翻译...

PS：阅读本期https://github.com/willmcpo/body-scroll-lock/issues/236 https://github.com/willmcpo/body-scroll-lock/issues/236它说如果你通过NPM安装库，问题将无法解决。你需要从 GitHub 下载它——然后就可以了。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

userinterface

scroll

safari

ios15

iOS 15 safari 工具栏现在在元素内滚动时隐藏 的相关文章

  • Java - SwingWorker - 我们可以从其他 SwingWorker 调用一个 SwingWorker 而不是 EDT

    我有一个SwingWorker如下 public class MainWorker extends SwingWorker Void MyObject 我调用了上面的Swing Worker来自东部夏令时间 MainWorker mainW

  • BlackBerry - 带居中位图的 ButtonField

    我有一个从 ButtonField 扩展的类 class BitmapButtonField extends ButtonField private Bitmap bitmap private int buttonWidth private

  • 如何使我的网络应用程序兼容 iPhone 5？

    我有一个使用 iOS safari 优化为 Web 应用程序的网站 因此添加到主屏幕会在单独的 Web 视图中打开该应用程序 然而 它总是以 3 5 信箱模式打开 而不是拉伸以填充屏幕 我知道使用本机应用程序 您只需添加 iPhone 5

  • 设计 GUI [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 作为一个几乎没有 或没有 艺术倾向的开发人员 您将如何为应用程序设计 GUI 特别是 我正在考虑桌面应用程序 但任何与网络应用程序相关

  • 可滚动Div，哪些元素可以看到

    我们有一个带有 CSS 的可滚动 divhieght 40px 里面有多个LIheight 20px div li title I1 item1 li li title I2 item2 li li title I3 item3 li li

  • GUI设计技术增强用户体验[关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi

  • 创建圆形图像 PIL Tkinter

    Currently I have a zoom feature in my application that works very well however I d like the actual zoom box to be a circ

  • 更改滚动时的 div 不透明度

    我怎样才能做到当你向下滚动页面时 下一个 DIV 会在前一个 DIV 之上淡出 我设置了这个小提琴来更好地说明它 http jsfiddle net meEf4 176 http jsfiddle net meEf4 176 例如 如果您位

  • MATLAB - GUI 和 OPC 服务器

    我想在 MATLAB 中设计一个图形用户界面 可以使用 MATLAB 的过程控制对象链接和嵌入 OPC 工具箱连续读取数据 我怎样才能实现这个 我已经设计了图形用户界面 但我无法将数据读入图形用户界面 就这样做 type opctoolMA

  • 滚动效果：先慢后快

    我正在尝试创建滚动效果 当onclick事件被触发 我想要那个div1滚动到dev2 一开始应该慢 然后快 这是一个使用此效果的网站 http community saucony com kinvara3 http community sa

  • 如何使用Python在没有窗口的情况下在屏幕上显示文本

    问题 我需要在没有窗口的情况下直接将文本写入屏幕 文本需要显示在所有其他窗口和全屏应用程序之上 并且不应以任何方式单击或交互 Example The text doesn t need to have a transparent backg

  • 如何在 Safari 上打开本地 html 文件？

    我想打开本地 html 文件Safari集成到我的Swift 3应用 我知道如何使用网址来做到这一点 这是我用来执行此操作的代码 let encodedString url addingPercentEncoding withAllowed

  • ASP.NET - Google Chrome 缓存 DropDownList 选择

    我的购物车页面上的 Google Chrome 和 Safari 似乎遇到了缓存问题 购物车中有 2 个下拉列表 当您在更改下拉列表中的值后点击结帐按钮时 它会将列表中选择的内容提交到数据库 解释意外的行为有点困难 所以我会尝试一步一步地写

  • mod_rewrite GUI？

    任何人都有用于开发 mod rewrite 规则的图形工具 理想情况下 它会显示重写管道 然后当给定 uri 实例时 会显示应用时的转换 让它们正确设置总是很痛苦 因此任何使其变得更容易的方法都会有所帮助 对于 htaccess 阅读 mo

  • 如何在 WPF 应用程序中实现气球消息

    我们想使用气球消息 如UX Guide http msdn microsoft com en us library aa511451 aspx来自微软 我发现一些示例使用 Windows 窗体中的本机代码 但本机代码需要组件的句柄 这对于

  • 横向旋转到纵向时的字体大小怪异 - CSS 媒体查询 - iPhone5 Safari

    我已经用谷歌搜索了这个 但无法弄清楚 谢谢你的帮助 Studiolynch com 响应式和流体布局 在 iphone 5 Safari 中完美运行 除了从横向模式旋转到纵向模式会使字体大小小于应有的大小 但是 如果您最初以纵向模式加载页面

  • 如何使用 C++ 禁用另一个进程中窗口上的关闭按钮？

    我需要从另一个进程禁用窗口上的关闭按钮 我有它的句柄hWnd我尝试这样做 DWORD dwCStyle GetClassLongPtr hWnd GCL STYLE SetClassLongPtr hWnd GCL STYLE dwCSty

  • 带有 `:hover` 和多个相邻兄弟选择器的 Webkit 错误

    Safari 和 Chrome 以及 Opera 和 Firefox 都可以处理 hover伪类和相邻兄弟选择器 a hover div 这有效 但是 当添加另一个相邻兄弟时 div hover a div Webkit 崩溃了 但是 如果

  • Tkinter：消息小部件中锚点选项的正确值是多少？

    我一直在学习 tkinterTkinter 中的消息小部件 https python course eu tkinter message widget in tkinter php at Python 课程和教程 https python

  • 如何从intellij项目视图中隐藏不必要的文件？

    给定一个示例 gradle 项目 其项目结构如下所示 正如你所看到的 有很多东西你实际上不需要在想法中看到 但你需要它们存在 我知道下面被忽略的文件 文件夹类型Editor File Types但这些正在影响库和项目 idea 会在各处忽略

随机推荐

  • 以下划线开头的变量用于属性装饰器

    我是Python新手 所以 如果这是一个基本问题 请原谅我 我在互联网和SO上研究了这个主题 但我找不到解释 我正在使用 Anaconda 3 6 发行版 我正在尝试为属性创建一个简单的 getter 和 setter 我将引导您解决我遇到

  • 生成器和数组有什么区别？

    今天 PHP 团队发布了PHP 5 5 0 http php net archive 2013 php id2013 06 20 1版本 其中包括对发电机 阅读文档 https www php net manual en language

  • onload=function 与 window.onload=function

    使用 window onload function 有什么真正的优势吗 超过 onload function 我知道 window onload 看起来更合适 但这不是我选择它的好理由 特别是它比 onload 更长 更慢 经过一些耗时的搜

  • C 解引用指针

    我开始学习C 但我不知道为什么应用程序总是崩溃 include

  • 将 Tableau 升级到 9.2 后，我无法在 Tableau Server (9.1) 中发布工作簿？

    有人经历过这个吗 这是非常令人沮丧的 因为我花了几个小时准备升级后的 9 2 版本的工作簿 我尝试发布到 9 1 Tableau Server 但它不允许 看来我可能还得再花几个小时在 9 0 上重新创建仪表板 9 0 与我们拥有的 Tab

  • 全局安装 Composer 以供 Laravel 使用？

    我在全局安装作曲家时遇到一些问题 我将 Composer 安装到 C wamp bin php php5 4 12 目录中 我使用的是 WAMP 并使用以下命令在 C wamp www project 中创建一个项目 php compose

  • 无法清除 WPF ListBox.SelectedItems 集合

    我似乎无法清除数据绑定 WPF ListBox 的 SelectedItems 集合 我尝试过调用 ListBox SelectedItems Clear 尝试将 SelectedIndex 设置为 1 将 SelectedItem 设置为

  • 菜单项的自定义视图

    我需要有动态菜单项 用户定义颜色的圆圈 如下所示 触摸此菜单项将打开一个颜色选择器 现在 我有示例 ColorPickerIcon 扩展了 View public class ColorPickerIcon extends View pri

  • Python subprocess.Popen.wait() 即使发生错误也返回 0

    我正在通过 Python 的子进程模块运行命令行实用程序 我使用命令行参数和 stdout subprocess PIPE 创建一个 subprocess Popen 对象 然后使用 subprocess wait 等待任务完成并返回返回代

  • 在 Google 图表中显示/隐藏线条/数据

    我正在尝试制作一个包含 2 条线的谷歌折线图 您应该能够通过两个复选框打开和关闭它们 显示 隐藏 有人有任何想法可以做到这一点 或者只是给出一些指示吗 我的猜测是一些 onClick jQuery 的东西

  • TS2307：找不到模块“类验证器”

    我正在尝试使用类验证器 https github com pleerock class validatorTypescript 项目中的模块 但是 当我编译打字稿时 会发出以下警告 src main ts domain Order ts 1

  • 获取并在 Woocommerce 单一产品页面上显示税率

    我正在尝试找到一种方法 如何仅显示产品所具有的税率 16 或 7 基本上 这个想法是应该有一个静态税 价格包含16 税费 or 价格含7 税 因此 百分比利率应该根据产品的利率而动态变化 知道如何解决这个问题 我找到的所有解决方案都显示完整

  • RabbitMQ 中的消息序列出现意外行为

    我想实现类似于选项 3 的 RabbitMQ 拓扑here https engineering nanit com rabbitmq retries the full story ca4cc6c5b493 除了一些差异 新拓扑每天应该处理几

  • 为什么我要使用无限超时的 Sleep() ？

    据 MSDN 报道 Sleep http msdn microsoft com en us library ms686298 VS 85 aspx可以提供INFINITE值并且 表明暂停不应超时 为什么我要调用 Sleep INFINITE

  • 是否有工具可以找出 PC 上安装了哪个 .NET 框架？

    我知道官方的方法是注册表 但这有点耗时 我必须检查几台电脑上安装的版本 它们都没有 VisualStudio 但它们全部 可能 a NET 框架的版本 既然热水可能已经存在 那么我在哪里可以找到它呢 这是一个免费的轻量级工具 可以快速完成此

  • 我们的记录中不存在 AWS 访问密钥 ID

    我创建了一个新的访问密钥并在 AWS CLI 中配置了该密钥aws configure 它创造了 ini文件输入 aws config 当我跑步时aws s3 ls它给 调用 ListBuckets 操作时发生客户端错误 InvalidAc

  • PHP 网址问题

    有没有办法可以使用 PHP 从链接中删除变量 例如 如果我有一个读取的链接http localhost link index php s 30 p 3我该如何去掉 s 30 p 3所以我的链接是这样的http localhost link

  • 如何将 URL 中的图像附加到 FormData - Javascript

    这是我的小 JavaScript 代码

  • Caffe：如何通过代码获取`solver.prototxt`参数？

    我想访问solver prototxt参数如base lr 基础学习率 或weight decay来自Python代码 有什么方法可以从solver net目的 谢谢 根据本教程 http nbviewer jupyter org gith

  • iOS 15 safari 工具栏现在在元素内滚动时隐藏

    在 iOS 15 上 无论您有顶部还是底部工具栏 在元素内滚动都会导致窗口调整大小 工具栏消失 在 iOS 14 上 只有当主体滚动时才会发生这种情况 请参阅下面的 gif 注意 黄色区域是一个带有溢出滚动的 div 并且主体不滚动 iOS

热门标签