iframe not working on iphone

[miniii91]

Ello

I’ve basically built a website for my mate, she wanted a horizontal scrolling gallery which stays lock in the same area (if that makes sense). So basically I built the gallery using Iframe which does excatly what she wanted. However once I uploaded the website I acessed it on my ipod touch and the gallery doesn’t move side to side which is very annoying as it seems to work fine everywhere else. I’ve tried two finger scrolling that doesn’t work at all.

Any suggestions on how to resolve this issue?

Thanks

=)

[Johnnyb]

Hey mini! I can’t solve your horizontal scrolling issue, but I can suggest using media queries to change the gallery to be a vertical one for smaller devices. Should just take a few straight-forward changes to some of your gallery tags in your CSS.

[miniii91]

That’s pretty epic =)
It does make a lot of sense to use that to fix the problem (and quick) But I would like to keep the same style for the PC and mobile…

Here’s the website if you want to see what I excatly want (it’s pretty basic) =)

sarahanneshutterbug.com

Thank you for the heads up about Media Queries =)

[TheDoc]

Instead of an iframe, why don’t you just use a div with a fixed height and width? Surely that is the better way to go.

[miniii91]

That could also work but I’ve looked into the issue and I have found out I could just use frames … Apple seems to have support for this so I’ll give it a try =)

http://support.apple.com/kb/HT1484?viewlocale=en_US

[miniii91]

@ Wolfcry911 I know frames are dead but Apple make it so akward with what you can and can not do on it’s devices that you have to revert to old skool shizzz. =/

@Eric thank you Eric, one random question … like on iframe can I hide the scroll-bar using a little bit of CSS black magic? =)

[miniii91]

Fixed btw just to let help anyone all you do is

changed the overflow on the CSS to auto so like…

overflow:auto;

:)

[bobjtls]

User csdco (https://github.com/fancyapps/fancyBox/issues/2#issuecomment-5997068) has provided a simple answer that solved the issue for me.

---

It’s much easier to control overflowed divs than it is iframes, and the scrolling + blank content issues are working all the way back to iOS 4, where previously I wasn’t even able to get the 2 finger scrolling to work (in iframes).

It goes something like this:

a-file.html:

…

[shadab]

try to add CSS3 property [ -webkit-overflow-scrolling:touch; overflow:auto;] to the parent container. Worked fine!

[Author]

Posts