469,362 Members | 2,441 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,362 developers. It's quick & easy.

Set IFrame Style Using JavaScript?

I'm creating a dynamic iframe element:

var iframe=document.createElement("iframe");

I want attach a style to the element, overflow-x:hidden. However, I can
not find a way to do this via JavaScript. For example, the following do
NOT work:

iframe.style.overflow-x="hidden";
iframe.style="{overflow-x:hidden;"};

Any ideas?

Thanks!
Cliff.

Jul 23 '05 #1
5 27494


de*******@gmail.com wrote:
I'm creating a dynamic iframe element:

var iframe=document.createElement("iframe");

I want attach a style to the element, overflow-x:hidden. However, I can
not find a way to do this via JavaScript. For example, the following do
NOT work:

iframe.style.overflow-x="hidden";
iframe.style="{overflow-x:hidden;"};


Generally with CSS property-name you use
element.style.propertyName
so
iframe.style.overflowX = "hidden";
is the right syntax. Not sure however it makes much sense to set that
property on an iframe but if it has the right effect for you with static
CSS then of course setting it dynamically with script should work the same.

--

Martin Honnen
http://JavaScript.FAQTs.com/
Jul 23 '05 #2
What I'm really trying to do is to remove the horizontal scrollbar on a
dynamically created IFrame. The only thing I've found is setting
scrolling=no but this has the unwanted effect of removing the vertical
scrollbar also. Setting the overflowX property as you indicated does
not seem to do anything... so I'm still trying to figure out how to
prevent that horizontal scrollbar from appearing...

Thanks for your tip... if you've got another suggestion for the
horizontal scrollbar problem I'd like to hear it.

Thanks,
Cliff.

Jul 23 '05 #3


de*******@gmail.com wrote:
What I'm really trying to do is to remove the horizontal scrollbar on a
dynamically created IFrame. The only thing I've found is setting
scrolling=no but this has the unwanted effect of removing the vertical
scrollbar also. Setting the overflowX property as you indicated does
not seem to do anything... so I'm still trying to figure out how to
prevent that horizontal scrollbar from appearing...


You need to apply the CSS inside the document of the iframe, there you
need a rule
html, body { overflow-x: hidden; }
I don't think CSS applied to the <iframe> element will help.
--

Martin Honnen
http://JavaScript.FAQTs.com/
Jul 23 '05 #4

<de*******@gmail.com> wrote in message
news:11**********************@f14g2000cwb.googlegr oups.com...
I'm creating a dynamic iframe element:

var iframe=document.createElement("iframe");

I want attach a style to the element, overflow-x:hidden. However, I can
not find a way to do this via JavaScript. For example, the following do
NOT work:

iframe.style.overflow-x="hidden";
iframe.style="{overflow-x:hidden;"};

Any ideas?

Thanks!
Cliff.


In scripts it's "overflowX", not "overflow-x"

In IE (at least) the iframe must be referenced as an element of the
document.all collection, so:

document.all.iframe.style.overflowX = "hidden";

might work.
Jul 23 '05 #5
Vic Sowers wrote:
In IE (at least) the iframe must be referenced as an element of the
document.all collection,
No, it need not.
so:

document.all.iframe.style.overflowX = "hidden";

might work.


Even in IE,

document.frames['iframe'].style.overflowX = "hidden";

suffices. No need for IE only code.

And please read the FAQ on proper quoting.
PointedEars
Jul 23 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by Dean | last post: by
11 posts views Thread by Eric Osman | last post: by
1 post views Thread by Brett | last post: by
4 posts views Thread by azeet.chebrolu | last post: by
1 post views Thread by c.verma | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.