ios - 在 iPad 横向模式下触发下拉菜单

标签 ios css ipad drop-down-menu touch

我们的网站上有一个简单的基于 CSS(无 JS)的下拉菜单,除了一个以外,它在各个方面都能完美运行。在横向模式的 iPad 上,如果您单击菜单下方的链接(例如面包屑),则触摸该链接会触发弹出窗口,然后当您松开手指而不是松开手指时,会触发弹出窗口中的链接您最初触摸的链接。

<li>
    <a href="http://categorypage">
    <ul class="flyout">
        <li><a href="blah...

.header li:hover .flyout {
    display: block;
}

网站(警告成人内容)是http://www.lovehoney.co.uk

到目前为止我尝试过但没有成功的事情:

  1. 更改容器的 z-indexes。
  2. 强制在弹出窗口上不显示当然会阻止弹出窗口,但您仍然可以看到导航被触发,所以我不认为这是弹出窗口的错误。
  3. 指针事件:关闭时没有飞出。

其他信息

  1. 该问题影响横屏模式下的 iPad 4,但不影响 iPad 1
  2. Chrome 和 Safari 都存在该错误
  3. 纵向模式很好。
  4. 点击导航上方不会触发问题。

最佳答案

最后我通过将视口(viewport)元更改为

来解决这个问题
<meta name="viewport" content="initial-scale=1" />

这稍微降低了响应速度,但解决了问题。

关于ios - 在 iPad 横向模式下触发下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19154356/

相关文章:

iphone - uiview 不显示在应用程序委托(delegate)中

javascript - 为什么我在ipad air中收到的播放按钮形状不同于在台式机中?

objective-c - RestKit SerializationMimeType - 它是否使用相同的类型进行反序列化?

ios - prepareForSegue 中的分配 false

ios - CreateNewUser() firebase 方法在用户 uid 的闭包中返回 nil

jquery - HTML5 视频重叠——带有可点击的按钮

angular - iPad 的 Safari 10 无法加载 Angular 5 应用程序(适用于 Safari 11)

ios - Firebase 使用苹果登录。新用户和回头客

css - compass 修改但不更改css

jquery - 如何使用 jQuery 设置负 z-index?