简体   繁体   English

锚链接在ipad上无法正常工作

[英]anchor links not working properly on ipad

We have a problem with a fixed element on iPad. 我们在iPad上有固定元素的问题。 You can check our layout here: http://cibology.edoardobiasini.it/ The position:fixed element on the right contains a nav with anchor links to the page. 您可以在此处查看我们的布局: http//cibology.edoardobiasini.it/右侧的position:fixed元素包含一个带有指向页面的锚点链接的导航。 On desktop browsers we have no problems, while on iPad the content doesn't scroll after the first click on the nav, unless you force the page to scroll with the fingers. 在桌面浏览器上我们没有问题,而在iPad上,第一次点击导航后内容不会滚动,除非您强制页面用手指滚动。

Does anybody have any advice?? 有人有什么建议吗?

It is the Apple thing with position:fixed The only solution i came with is that we change the position of the navbar into absolute and calculate the right top value of the document. 这是苹果公司的position:fixed我带来的唯一解决方案是我们将导航栏的位置更改为absolute并计算文档的正确顶部值。 This position change is happening when scrolling stops : 滚动停止时会发生此位置更改:

$("body").off("scroll", function(){ 
    //here goes the code 
})

So, the user don't see the difference, and once the scroll is active again the position is backed to fixed 因此,用户看不到差异,并且一旦滚动再次激活,则将位置备份为fixed

Found the solution here: https://stackoverflow.com/a/9198836/1145706 在这里找到解决方案: https//stackoverflow.com/a/9198836/1145706

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). 我在菜单项上创建了不可见的div,当页面滚动时会改变它的位置(在实际位置模拟固定元素:固定菜单项)。 When user clicks or hover over those invisble divs the real ones are called 当用户点击或悬停在那些隐藏的div上时,会调用真实的div

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM