0

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/

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

1 Answer 1

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.

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

5 Comments

Wow..it's working...just small question..why it is showing scroll bar in internet explorer even without hovering..
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
I had checked in IE 8 and it's hiding scrollbar by default and not even displaying scroll when hovered
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.
jsfiddle.net/avall/WHDFb This should work everywhere - I made an example with DIV wrap which does the crop thing.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.