2

I made a simple demo-page for my problem: http://jsfiddle.net/vvgv93k0/2/

As you can see it consists of an iframe and a simple p:

 <iframe src="http://www.w3schools.com" width="100%" height="300"></iframe>
 <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium do

What i would like to prevent is, that when the user clicks into the iframe, and then scrolls, the iframe is scrolled.

I want that only the main page is scrolled!

I tried to make my iframe not selectable with:

      -webkit-user-select: none;

But that somehow didnt worked! Wht can i do so that the scroll is never perfromed in the iframe? Thanks!

John Smith
  • 6,105
  • 16
  • 58
  • 109

1 Answers1

2

in your css:

iframe{
    overflow:hidden;
}

set iframe as :

<iframe src="http://bing.com" class="foo" scrolling="no" seamless="seamless"></iframe>

scrolling="no"

seamless="seamless"

Vaibhav J
  • 1,316
  • 8
  • 15
  • I'm pretty sure that is not allowed. If it is... I learned something new, But I do not think you can do that – Scott Selby Dec 15 '14 at 07:35
  • pl. check now, i have updated my code, also overflow is not working, you can try overflow-y: hidden; instead. – Vaibhav J Dec 15 '14 at 07:38
  • yea - I think those attributes in the iframe element will work , but you can't style the actual iframe , I don't think that css you put in there will do anything at all ... again I may be wrong – Scott Selby Dec 15 '14 at 08:14