Is there a way to make a DIV invisible using JavaScript

[Charlie]

Hi:

I have sections on a page in asp panels. I would like to hide/show using
javascript, but don't see a visible property for DIV. How do you do this?

Thanks,
Charlie

[David Hogue]

You can do it with css:

document.getElementById('theDivsId').style.display = 'none';

Set it to 'block' to make it visible again. This will work for any
element, not just divs.

Charlie@CBFC wrote:

Hi:

I have sections on a page in asp panels. I would like to hide/show using
javascript, but don't see a visible property for DIV. How do you do this?

Thanks,
Charlie

--
David Hogue

[Rajesh CKR]

you can use

mydiv = document.getElementById("mydiv");
mydiv.style.display = "none"; //to hide it
mydiv.style.visibility = "block"; //to show it

HTH

Raj


"Charlie@CBFC" <fi********@verizon.net> wrote in message
news:OQ**************@TK2MSFTNGP04.phx.gbl...

Hi:

I have sections on a page in asp panels. I would like to hide/show using
javascript, but don't see a visible property for DIV. How do you do this?

Thanks,
Charlie

[Göran Andersson]

You are mixing display and visibility, that is not working.

Use either

mydiv.style.display = "none"; //to hide it
mydiv.style.display = "block"; //to show it

or

mydiv.style.visibility = "hidden"; //to hide it
mydiv.style.visibility = "visible"; //to show it
Rajesh CKR wrote:

you can use

mydiv = document.getElementById("mydiv");
mydiv.style.display = "none"; //to hide it
mydiv.style.visibility = "block"; //to show it

HTH

Raj
"Charlie@CBFC" <fi********@verizon.net> wrote in message
news:OQ**************@TK2MSFTNGP04.phx.gbl...

Hi:

I have sections on a page in asp panels. I would like to hide/show
using javascript, but don't see a visible property for DIV. How do
you do this?

Thanks,
Charlie

[Jeeran]

Hello fi********@verizon.net,

I like to separate things as much as possible by having all style related
stuf in CSS files. So, I would create a css class for each state and store
them in a css file:

..hiddenDiv {
display: none;
}
..visibleDiv{
display: block;
}
Then use JavaScript to switch the css class each time:

to hide:
mydiv.className = "hiddenDiv";

to show:
mydiv.className = "visibleDiv";

p.s. You can use "visibility" instead of "display", but there is a difference.
"visibility: hidden;" hides the DIV but it will still occupy the area it
took when it was visible. While "display: none;" will hide it and shift everything
around it to take up its space.

Hi:

I have sections on a page in asp panels. I would like to hide/show
using javascript, but don't see a visible property for DIV. How do
you do this?

Thanks,
Charlie

[Edwin Knoppert]

That's good info!

(PS, sorry i don;'t think the css itself is a good solution in this case)

"Jeeran" <je****@newsgroups.nospam> schreef in bericht
news:55*************************@msnews.microsoft. com...

Hello fi********@verizon.net,

I like to separate things as much as possible by having all style related
stuf in CSS files. So, I would create a css class for each state and store
them in a css file:

.hiddenDiv {
display: none;
}
.visibleDiv{
display: block;
}
Then use JavaScript to switch the css class each time:

to hide: mydiv.className = "hiddenDiv";

to show:
mydiv.className = "visibleDiv";

p.s. You can use "visibility" instead of "display", but there is a
difference. "visibility: hidden;" hides the DIV but it will still occupy
the area it took when it was visible. While "display: none;" will hide it
and shift everything around it to take up its space.

Hi:

I have sections on a page in asp panels. I would like to hide/show
using javascript, but don't see a visible property for DIV. How do
you do this?

Thanks,
Charlie

[Laurent Bugnion]

Hi,

Edwin Knoppert wrote:

That's good info!

(PS, sorry i don;'t think the css itself is a good solution in this case)

Why not?

If you really don't want to use CSS, you can also remove the node from
the DOM using JavaScript. Identify the node (with getElementById, for
example), and then remove it from its parentNode using removeChild.

Note however, that this will force a relayout of your document, which
might not be satisfactory. if you don't want a relayout, then you have
to use <element>.style.visible

HTH,
Laurent
--
Laurent Bugnion, GalaSoft
Software engineering: http://www.galasoft-LB.ch
Private/Malaysia: http://mypage.bluewin.ch/lbugnion
Support children in Calcutta: http://www.calcutta-espoir.ch