0

How do I hide (and color) the iframe scrollbar in Firefox and Internet Explorer with css or Javascript? I am using height auto iframe content and it is working fine but scrollbar is showing (except in Chrome). I am using iframe height auto for cross domain height auto.

Community
  • 1
  • 1
Mohammed Javed
  • 866
  • 2
  • 9
  • 24

2 Answers2

1

I recall having a similar issue a while back , depending on your needs I would try using :

overflow-y:hidden;

in the css or the 

scrolling="no"

inside the iframe element. ( This should work)

If all else fails , here's a little hack , set the parent div slightly smaller width than the child div and set its css like so:

    .parent {

        overflow-x:hidden;
        width:486px;
        height:300px;
    }
    .child {
        width:500px;
        height:auto;
    }

Then to make it look even slightly better play with the css eg: set the border right and it will look as though you never did such a hack , but as i said before , try the scrolling="no" first , as this latter method would probably be frowned upon by some, however in my defense it is a solution to a problem.

Happy Coding.

EaziLuizi
  • 1,557
  • 1
  • 16
  • 25
0

If you have a script that's taking care of the height so you don't need to scroll, you can simply turn scrolling off so they're not there, getting in the way:

<iframe src="//www.abc.net.au/" scrolling="no" width="500" height="500"></iframe>

scrolling="no" does the trick.

Example: http://jsfiddle.net/rt2bf/

Ming
  • 4,468
  • 1
  • 21
  • 21
  • In the fiddle there's no scrollbars when `scrolling="no"` is added. If you're seeing a different result, can we have a look at your code, in a fiddle, or at your site where this is happening? – Ming Jan 31 '14 at 07:15