Using iframe with scroll bar in jQuery Mobile

Question

I have a problem with showing scroll bar when to use iframe tag.

I have to show scroll bar because the content is over 100 lines.

Although on desktop browsers, I can see the scroll bar in iframe box, on mobile Safari, it doesn't show scroll bar even I added the overflow style.

iframe {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}

<iframe id="PageHomePrivacyContent" src="test_en.html"></iframe>

I have looked for other solutions suchas iScroll, jQuery scroll plugin, etc.

However, all doesn't work.

What is the solution?

P.S. HTML5 removed scrolling attribute in iframe so please don't mention it.

Thanks,

Sung Am YANG

I'll not use the iframe element in my mobile web application. It's picky and unstable for mobile devices. — Sungam Yang, Apr 09 '13 at 16:00
you can check this link for [ios scrolling iframe](http://stackoverflow.com/a/26189171/3865082) — Usman Khawaja, Oct 09 '15 at 13:39

score 0 · Answer 1 · answered Feb 28 '16 at 21:01

0

try

.iframe-holder {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}

then

<div class="iframe-holder">
 <iframe id="PageHomePrivacyContent" src="test_en.html"></iframe>
</div>

answered Feb 28 '16 at 21:01

Weijing Jay Lin

1 Answers1