anchor links not working properly on ipad

Question

We have a problem with a fixed element on 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. 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.

Does anybody have any advice??

Answer 1

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

Answer 2

Found the solution here: 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). When user clicks or hover over those invisble divs the real ones are called