Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Mobile Safari iOS 6 Bug #7

Open
manfromanotherland opened this issue Oct 24, 2012 · 7 comments
Open

Mobile Safari iOS 6 Bug #7

manfromanotherland opened this issue Oct 24, 2012 · 7 comments

Comments

@manfromanotherland
Copy link

If the site is taller than the viewport in Mobile Safari (iOS6), the image don't fill the background.

When first loads (no scroll), everything is OK: http://cl.ly/KOOP
On first scroll, this happens: http://cl.ly/KOHk

The site is live at http://trijoiaconceito.com.br/

Maybe I'm doing something wrong? Any help?

BTW, EXCELLENT plugin, before this I used supersized, but yours is responsive and loads faster :D

@thridda
Copy link

thridda commented Nov 1, 2012

Same issue here. I'm looking at using a gradient overlay on a media query to provide a transition that's less jarring as a workaround. Seems like Apple is fiddling with the viewport on the address bar...

@waynecongar
Copy link

Having the same issue here.

@ChrisLusted
Copy link

Did anyone get a fix for this?

@flody
Copy link

flody commented Nov 15, 2013

I had the same problem, also with chrome on non ios.

I added in my css:

.mc-image img{
    position:absolute;
}

and it seems to fix the problem.

@basbeenhakker
Copy link

I tried Flody's solution, but it did not work for me. Did it work for anyone else?

Problem also occurs on IOS 7

@PanamiITSystems
Copy link

I found a partial solution for the bug on mobile safari:

#gradient, #maximage > div {min-height:530px}

The min-height is set to 530px for better suit with iPhone5, it could be less for iOS lower than iOS6.
On the other hand, the problem is that with this css, the image is bigger, so it doesn't fit so good, but it's better than the white space...

Please, let me know if there's a better approach.

Thanks! to everybody at this comunity, specially to Aaron Vanderzwan in this case.

@whalemanj
Copy link

Hello!

Again, thanks so much for a kickass plugin.

Has anyone find a solution for this? Did you opt for another method (cycle 2)? I have not been able to get the tweaks here to help out.. it seems there may be a solution in modifying the javascript, but I can't figure out exactly how.

The post here has some good insight as to the cause of the issue:
http://stackoverflow.com/questions/22741143/css-background-stretches-to-fill-height-in-ios-but-there-is-white-space-on-scrol

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

8 participants