David wyatt
Posts: 0
Joined: Mon Sep 15, 2014 7:12 pm

html component not scrolling

HI,

I have a html component on a page with an iframe. On the preview, html5 and android it works great. Now Ive exported to ios and the html component doesnt scroll. Instead the component as a whole and the bottom navigation buttons scroll up

this is the css im using

div div.htmlOtherSite {
position: absolute;
overflow: hidden;

}

Ive attached a screenshot showing how the components are scrolling not the html contents

Image

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

html component not scrolling

Hi David,

Please try this solution: http://davidwalsh.name/scroll-iframes...

Regards.

David wyatt
Posts: 0
Joined: Mon Sep 15, 2014 7:12 pm

html component not scrolling

Thanks Yurii works great

David wyatt
Posts: 0
Joined: Mon Sep 15, 2014 7:12 pm

html component not scrolling

HI Yurii,

there seems to be a strange side effect. Once the html component loads it stops the bar code scanner function from loading. It freezes the app, but if you switch out and back into the app the bar code scanner continues.

Through debugging I know its the line
-webkit-overflow-scrolling: touch;
that seems to cause the issue.

David wyatt
Posts: 0
Joined: Mon Sep 15, 2014 7:12 pm

html component not scrolling

Additionally it looks like it stops the phone from launching system window. as before I visited the page with the html component it worked. then when i went back it stopped working.

the code is
window.open('https://www.facebook.com/tkmaxx','_sy...');

thanks for your help

David wyatt
Posts: 0
Joined: Mon Sep 15, 2014 7:12 pm

html component not scrolling

update,

it isnt due to the webkit-overflow-scrolling: touch line. Im at a loss to explain it.
Everything works fine (bar code scanner,system window lanuches) across multiple pages, but when i load the page with the html component they stop working. Until i switch out and then back in to the app. at this point the bar code scanner launches. But if i try to relaunch it, same issue.

The only events i have on the page are a load command to set the iframe source and the following on a pageshow event

var section = localStorage.getItem('section');
var scanner = localStorage.getItem('scanaddress');
//
Apperyio('mobileheader').text("Shopping");

Code: Select all

 if (section =="scan") {   

jQuery("#iframeForExternalSite").attr("src", scanner);

} else {
}

When you run the bar code scanner from another page it sets the 2 variables and navigates to the page. This way if the page is accessed through a link nothing happens, if it is accessed through a service complete it loads a different iframe source.

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

html component not scrolling

Could you check are there any errors in console? This: https://devcenter.appery.io/documenta... should help.

David wyatt
Posts: 0
Joined: Mon Sep 15, 2014 7:12 pm

html component not scrolling

HI Sergiy,

there appears to be no errors when i tried debugging.
Its really strange, when the app loads after a second or so a swirling loader appears indicating something has just loaded. If i navigate from the start page before that event everything works fine. Ive tried deactivating all my load events but it still happens. I was wondering if it could be the push register as I havent created a push certificate for IOS yet. The devices are being registered to my push database.

thanks for your help

Alena Prykhodko
Posts: 0
Joined: Tue Apr 09, 2013 7:36 am

html component not scrolling

Hello David,

Sorry for delayed reply.
Hard to say what may cause this.
Have you tried with push certificate?

David wyatt
Posts: 0
Joined: Mon Sep 15, 2014 7:12 pm

html component not scrolling

Hi,
that's OK I appreciate the help. Sadly I've tried adding push certificate and still have same issue.

Return to “Issues”