How to set the overflow property dynamically using jQuery?

Question

I'm trying to set the css overflow property to scroll dynamically when the mouse is hovered to an iframe. But it's not displaying the scroll bar when hovered.

I tested this in firefox version 5.0

Below is jsfiddle: http://jsfiddle.net/sukumar/6ERtz/7/

In IE8 it seems to display ok on hover, but it also displays the bar when not hovered...not that that's much help! — dougajmcdonald
– dougajmcdonald, Commented Sep 14, 2011 at 8:35
@dougajmcdonald yeh..even i got puzzled with that..not sure whether it is bug in IE8 — JavaGeek
– JavaGeek, Commented Sep 14, 2011 at 9:02

avall · Accepted Answer · 2011-09-14 08:47:06Z

1

Overwrite display property for IFRAME element. Forcing IFRAME to be display:block solves the problem.

This is due to default display value for IFRAME in Firefox which is inline. Inline elements can't get scrollbars so your IFRAME is cropped.

edited Sep 14, 2011 at 8:47

answered Sep 14, 2011 at 8:37

avall

2,0752 gold badges16 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

JavaGeek Over a year ago

Wow..it's working...just small question..why it is showing scroll bar in internet explorer even without hovering..

avall Over a year ago

I think it's because of default scrolling settings in different browsers. It will work as you like if you additionally change the scrolling attribute. Example here: jsfiddle.net/avall/jyLnA/1

JavaGeek Over a year ago

I had checked in IE 8 and it's hiding scrollbar by default and not even displaying scroll when hovered

avall Over a year ago

IMHO the only way to deal with IE is to set scrolling="yes" or maybe wrap IFRAME with <div style="overflow:hidden"> which will make the crop thing instead of IFRAME.

avall Over a year ago

jsfiddle.net/avall/WHDFb This should work everywhere - I made an example with DIV wrap which does the crop thing.

Collectives™ on Stack Overflow

How to set the overflow property dynamically using jQuery?

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related