The difference between style.visibility and style.display

Possible duplicate:
What is the difference between visibility: hidden and display: none

I am considering examples to hide / show div tags using JavaScript. In some examples, they use visibility in some display .

eg.

 document.getElementById("divhotel").style.visibility = "hidden"; 

vs

 document.getElementById("divhotel").style.display = "none"; 

What is the difference between the two?

+4
source share
3 answers

When you set visibility to hidden , the element is not displayed, but still takes up the same place on the page.

When you get display to none , this element is not displayed and does not occupy any place on the page.

Most often I find myself using display , but it depends on what your script requires.

+10
source

visibility - how an element is visualized, the block in which it exists is still laid out regardless of the value. Because of this, items may be discarded. display - this is how it is displayed on the page: block there are elements of the type div , with full boxes; The none element does not appear on the page at all; inline is an inline element, such as a span tag or an anchor.

+2
source

Ah, beloved Google .

"style.visiblity makes the element visible or hidden, it still appears and takes up space on the page, even if you don't see it. If you set style.display to" none ", the markup is not processed and does not take up space on the page."

0
source

All Articles