使用位置时的问题：在iOS 5（iPad和iPhone）中固定为工具栏 [英] Issue when using position: fixed for toolbar in iOS 5 (iPad and iPhone)

问题描述

使用iOS 5在iPad或iPhone上访问我的网站（http://www.zero11arquitetura.com.br）时出现问题我无法修复。当窗口通过代码滚动每个位置：固定元素单击事件停止工作。你可以帮我吗？

There's an issue when accessing my website (http://www.zero11arquitetura.com.br) on iPad or iPhone with iOS 5 that I can´t fix. When window is scrolled thru code every position:fixed elements click event stop working. Can you please help me ?

这个网站结构使用顶部菜单div和头部div，位置为：fixed css。当用户单击菜单项窗口时，水平滚动直到达到其目标。
点击菜单项是通过每个img标签上的jQuery click方法完成的，滚动是通过jQuery animate方法完成的（$（html：not（：animated），body）。animate（{scrollLeft：varDestino} ，1500）;）

This site structure uses a top menu div and a header div with position: fixed css. When user clicks on a menu item window scrolls horizontally until it reaches its target. Clicking in the menu item is done by jQuery click method on each img tag and scrolling is done by jQuery animate method ($("html:not(:animated),body").animate({ scrollLeft: varDestino }, 1500);)

当页面加载时，菜单按照我的意图工作，但在滚动菜单之后，我尝试点击另一个菜单项没有任何反应。最奇怪的是，当用户手动滚动窗口（通过手指）时，一切都会再次起作用。

When page is loaded the menu works just as I intended but, after it scrolls thru menu, and I try to click on another menu item nothing happens. The strangest thing is that everything works again when user manually scrolls the window (by finger).

通过代码更改窗口滚动位置看起来是这样（jQuery调用窗口。滚动）固定元素丢失了它的可点击位置引用。

It looks like that by changing window scroll position by code (jQuery calls window.scroll) fixed elements lost its clickable position references.

有没有解决方法？

谢谢，

推荐答案

我用诀窍解决了这个问题。我在菜单项上创建了不可见的div，当页面滚动时会改变它的位置（在实际位置模拟固定元素：固定菜单项）。当用户点击或悬停在那些隐藏的div上时，真实的div被称为

I've solved this with a trick. I've created invisible divs over the menu items that changes it's position when page scrolls (simulating afixed element over the real position: fixed menu items). When user clicks or hover over those invisble divs the real ones are called

这篇关于使用位置时的问题：在iOS 5（iPad和iPhone）中固定为工具栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！