Issue when using position: fixed for toolbar in iOS 5 (iPad and iPhone)

限于喜欢 提交于 2019-12-20 06:12:19

问题


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 ?

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).

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

Is there any workaround for this ?

Thanks,


回答1:


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



来源:https://stackoverflow.com/questions/9151293/issue-when-using-position-fixed-for-toolbar-in-ios-5-ipad-and-iphone

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!