By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,086 Members | 1,452 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,086 IT Pros & Developers. It's quick & easy.

"Roll-up" or "collapse" IFrame?

P: n/a
I have an IFrame on my web pages that displays useful tips. I have a button
next to it that hides and shows it by triggering a Javascript call. I know
how to make the iframe invisible by changing it's "visibility" property, and
I know how to change it's size using the style "height" property.

The problem is, with both of those techniques the IFRAME still occupies the
same amount of real estate as before, even if it's now invisible / shrunken.
That is, the elements vertically below it in the containing TABLE do not
move up to fill in the unoccupied screen space. (Note: I am *not*
specifying any row or cell heights at all.)

How can I get the rest of the page to move up when I hide / shrink the
IFrame with Javascript?

Thanks.
Jul 23 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a


Robert Oschler wrote:
How can I get the rest of the page to move up when I hide / shrink the
IFrame with Javascript?


There is no difference to other elements, if you want to make an element
not consume any layout space and be hidden then set the CSS display
property to none e.g.
iframeElement.style.display = 'none'
to show it again set
iframeElement.style.display = ''
--

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

P: n/a

"Martin Honnen" <ma*******@yahoo.de> wrote in message
news:42***********************@newsread4.arcor-online.net...


There is no difference to other elements, if you want to make an element
not consume any layout space and be hidden then set the CSS display
property to none e.g.
iframeElement.style.display = 'none'
to show it again set
iframeElement.style.display = ''
--

Martin Honnen
http://JavaScript.FAQTs.com/


Thanks Martin, that did the trick. Got any quick ideas on what I could put
in it's place as an attractive "placeholder"? Something about 5 pixels
high?

Jul 23 '05 #3

P: n/a
alu

"Robert Oschler" <no************@nospam.com> wrote
I have an IFrame on my web pages that displays useful tips. I have a button next to it that hides and shows it by triggering a Javascript call. I know how to make the iframe invisible by changing it's "visibility" property, and I know how to change it's size using the style "height" property.

The problem is, with both of those techniques the IFRAME still occupies the same amount of real estate as before, even if it's now invisible / shrunken. That is, the elements vertically below it in the containing TABLE do not
move up to fill in the unoccupied screen space. (Note: I am *not*
specifying any row or cell heights at all.)

How can I get the rest of the page to move up when I hide / shrink the
IFrame with Javascript?

Thanks.


_________________________________________

what you want is style="display:none;" not "visibility:hidden"

-alu
Jul 23 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.