how to make a DIV or iFrame no scrollable

1 view
Skip to first unread message

Sura

unread,
Nov 13, 2009, 3:30:54 AM11/13/09
to Design the Web with CSS
Hi

I have a DIV which has an iframe in it. The content of the iframe is
longer than the iframe height. Hence it is scrolling even after using
"scrolling=no". Now I have placed the iframe in a DIV with property
set to "overflow:hidden" for the DIV. The scroll bars dont show now as
they got hidden but if I scroll with my mouse on the DIV the content
scrolls.

How can I stop this content from scrolling. Or if I can stop the
iframe from showing scroll bars then I dont have to use a DIV.

Any solution will be of great help.

The code:
<div style="width:1002px; height:577px; overflow:hidden; border:0px;">
<iframe src="http://www.yahoo.com" scrolling="no"
frameborder="0" width="1020px" height="600px"></iframe>
</div>

Thanks

jkronika

unread,
Nov 13, 2009, 11:35:30 AM11/13/09
to Design the Web with CSS
First option, and the only one possible without a JavaScript hack,
would be to increase the iframe height to fit the height of your
content. That would work fine so long as the iframe content is
consistently the same height.

If you want to use JavaScript, you can either set up an event handler
that prevents the default action of the onscroll event (not certain
that this would even be possible), or maybe to load the external
content into a DIV using AJAX, but both of those options are beyond
the scope of this discussion list.

There doesn't exist any pure CSS way, as far as I know, to completely
prevent scrolling, even when using overflow:hidden.

dnagel

unread,
Nov 21, 2009, 3:28:43 AM11/21/09
to Design the Web with CSS
I'm gonna recycle my clip board and paste in the link from my last
response...

http://adamfortuna.com/2009/09/30/resize-a-crossdomain-iframe/

Every-thing about iframe resizing is in that article.

D.
Reply all
Reply to author
Forward
0 new messages