Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

IOS can't click links in fixed footer until after scroll? [duplicate]

Possible Duplicate:
Mobile Webkit reflow issue

I have been trying to figure this out. I have a fixed footer on ios with 4 links in it. Their are also 6 links under it that should not be clickable since they are below. However on ios when unless you scroll the page first the links on the fixed footer do not work and it instead clicks the link below it. After you scroll the slightest bit it works fine. I hope i explained this clearly enough.

You can see an example of it here:
amstar.m77950.com
(view on iphone)

I tried applying z-index to basically every element on the page to see if there was a fix. I also used jquery to make sure that the z-index was being applied onLoad (although it should have been anyway).

Yet i still cannot get the links in the footer to work until after you scroll the page.

Any help on this is much apprceiated. Thanks.

Here is the css i am applying to the element:

.alertsBarClass {
background: url("dynamicimage.aspx?id=21844") no-repeat scroll 0 0 #EA7E25;
border-bottom: medium none;
bottom: 0;
display: block;
position: fixed;
width: 100%;
z-index: 1000;
}
like image 699
busyPixels Avatar asked Dec 29 '11 15:12

busyPixels


1 Answers

There are known issues with Position:Fixed in iOS 5.1 and anchors/links and scrolling. See the following bug #10301184, #10810232.

One thing that can help...sometimes... is to put cursor:pointer in the divs surrounding your links.

like image 129
Cliff Ribaudo Avatar answered Oct 13 '22 18:10

Cliff Ribaudo