Hi,

the modalframes are not scrollable on iOS (iPhone, iPad / iOS 4 and 5). In iOS 5 position:fixed should work.
I played a little bit around with the overflow-setting to get it work in iOS, but that broke MSIE...

Anyone solved that?

(btw: dont know if two-finger-scrolling works - but thats not the solution!)

Comments

Hunabku’s picture

Well its not Modal Frame that is the problem. iframes in general are not scrollable on recent iOS releases. The way around it involves adding the style "-webkit-overflow-scrolling:touch" for the container div that wraps the iframe. To do so you have to hack Modal Frames parent.js file.

--------
On about line 142 of parent.js find the following:

self.iframe.$container = $('<div id="modalframe-container"/>').append(self.iframe.$element);

--------
Replace with:

// My_Mod added following 6 lines and on 7th line inserted '+ mobileScrolling +' before id="modalframe-container"
var device = navigator.userAgent.toLowerCase();
var ios = device.match(/(iphone|ipod|ipad)/);
var mobileScrolling = '';
if (ios) {
    mobileScrolling = ' style="-webkit-overflow-scrolling:touch; overflow:scroll"';
}
self.iframe.$container = $('<div'+ mobileScrolling +' id="modalframe-container"/>').append(self.iframe.$element);
markus_petrux’s picture

Category: bug » support

How about trying something like overthrow?

https://github.com/filamentgroup/Overthrow/

It seems to me you could load overthrow.js on the page, and add a CSS class like:

.overthrow-enabled #modalframe-container {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

PS: This is not a bug in modalframe, but something that does not work properly on certain browsers.

dsnopek’s picture

Issue summary: View changes
Status: Active » Fixed

Approach suggested by @markus_petrux should work! Closing.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.