akv2 / MaxImage

The first jQuery plugin to use jQuery Cycle plugin as a fullscreen background slideshow.
http://www.aaronvanderzwan.com/maximage/2.0/
407 stars 219 forks source link

Mobile Safari iOS 6 Bug #7

Open manfromanotherland opened 11 years ago

manfromanotherland commented 11 years ago

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 commented 11 years ago

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 commented 11 years ago

Having the same issue here.

ChrisLusted commented 10 years ago

Did anyone get a fix for this?

flody commented 10 years ago

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 commented 10 years ago

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 commented 10 years ago

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 commented 9 years ago

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