How to set the overflow property dynamically using jQuery?

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/sukuma开发者_如何学Cr/6ERtz/7/

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.