HTML5 - Can't scroll the topic when viewing website on IPAD

[ptg]

Hello All,

I love the HTML5, and am so excited. But, the CSS doesn't seem to work properly when viewing the website with the safari browser on IPAD. Works fine in Safari on Mac, Safari on PC, and other browsers. I tried editing the CSS and messing with -webkit-overflow-scrolling: touch; but that didn't do the job. I have opened a case with Madcap Support. They have reproduced the problem and submitted a bug report for a future patch or release. I am hoping someone out there with excellent CSS/html knowledge might be able to come up with a work around for me.

Thanks in advance for your help!

[LTinker68]

Only thing I can think of is to explicitly set the overflow attribute on the html or body tag to scroll and see if that works.

[ptg]

Thanks for your reply. I tried that as well, but it didn't seem to do anything at all. Other ideas?

[LTinker68]

You might try setting the height to 99% instead of leaving it to auto. I had to do that once for a website created outside Flare -- don't remember why I had to do that, but it might trick it into adding the scrollbar.

BTW, have you double-check what version of browser is running on that IPAD? You might need to upgrade the browser on the IPAD (if you can) if it's an older version and doesn't support HTML5 output. You didn't mention which version of IPAD you had. Not that I know which browser it would be running, but if you have the first IPAD then that would be more likely to have a browser that doesn't support HTML5. Or doesn't have complete support, since it sounds like parts of it works.

[ptg]

I have not solved this problem yet, but I do have a clue. When I submit a search, the search output scrolls just fine in the topic "frame"
If this helps anyone else to a solution, please let me know.

Thanks

[doc_guy]

Have you tried doing a "two fingered scroll" on the iPad screen?

The HTML5 output renders all the page EXCEPT THE TOPIC as one page, then it uses an iFrame to render the topic. On other sites that use iFrames, you have to use two fingers on the iPad to scroll the iFrame content.

The issue here is that is how the iPad browser is set up to scroll. It's not an HTML5/Flare issue (except that Flare's "HTML5" output uses iFrames, which IS in Flare's control).

-Paul

[ptg]

Thank you for your input.

Yes, I have tried the two finger scroll. It moves the entire HTML Help up and down, but it doesn't scroll the content.

[ptg]

So the problem seems to be with the iframe. Developers seem to be struggling with the issue of scrolling an iframe on an IPAD. Lots of posts about it. Various work arounds proposed, none seem to work in all instances. People seem to be opting for a javascript or jquery solution

[doc_guy]

I can confirm this same issue. HTML5 is not usable at all for iPad devices, which almost makes HTML5 not usable at all for me.

If you think it is an issue that MC doesn't support iPad devices in HTML5 output, please join me in submitting this as a bug.

[doc_guy]

This is also an issue on iPhone. However, I have an Android phone (running Android 2.3) and the site scrolls properly.

However, it is a real bummer that HTML 5 output won't work for iOS users...

[Harrison73]

We are also struggling with this issue as had wanted to use HTML5 output in a help set likely to be viewed on Mobile devices - most commonly the IPAD.. Another less serious limitation we noted on the IPAD was that user cannot resize the "navigation pane" it just stays fixed to whatever its set at..

[doc_guy]

I think this must be something in the CSS for the main page layout. I'm going to do some testing to see if I can't isolate what CSS style is causing this, and what, if anything, we can do about it.

Clues: when you drag the screen upwards, the background moves up with your finger, but the iframe does not. Neither does the menu on the left hand side. That makes me think that there is a DIV that contains both these areas that is set to an absolute position. What are the ramifications of changing that property to something else? When I find it, I'll let you know.

[chunkee]

Any resolution on this? This is a darned deal breaker for this output.

TY.
JC

[berlrzdlb]

This is also an issue on iPhone. However, I have an Android phone (running Android 2.3) and the site scrolls properly.

However, it is a real bummer that HTML 5 output won't work for iOS users...

It's right? HTML 5 output won't work for iOS users?

[trishe]

I am having the problem of HTML 5 output working fine on iPhone 5/5s, but NOT on my Android. I get only so far down the page and then... nada.

Anyone else seen this?

[RamonS]

Not sure if it will be of any help, but does the mobile output from Flare overcome these issues? Trying to run a 'desktop' browser app on a mobile browser unfortunately is not the same. Given the tiny screens you do want something that is optimized for that environment anyway.