Geek Answers Handbook

When you show and hide a div, will it automatically adjust the surrounding elements?

When you show and hide a div, will it automatically adjust the surrounding elements?

Regarding how google maps http://maps.google.com/maps?hl=en&tab=wl has that small icon in which you can show / hide the left panel.

Is it easy to make it visible with an animation effect or more complex than that?

+4
source share
3 answers

In terms of reinstallation, if you use CSS, it depends on the weather, or you do not use the screen: no option or visibility: hidden tag.

Visibility will hide it, but will not affect the surrounding elements, the display on the other hand will be ...

Check out this bit of code that should highlight this ...

<div style="border: solid 2px black;"> <div style="visibility: hidden;"> Hello <br /> </div> </div> <br /> <div style="border: solid 2px black;"> <div style="display: none;"> Hello <br /> </div> </div>

Hope this helps! :)

+8
source

Any elements that are accepted to / from the normal stream (by default) will force the rest of the pages to adjust them accordingly. However, there are ways to remove items from a regular stream.

position: absolute or position: relative will remove the element from the normal stream. Using them, other elements will behave as if there were no positioned elements (unless they also use positioning rules).

To hide / show the div:

display: none
will remove an item from a normal stream

visibility: hidden
will hide the element, but keep its size in a normal flow

+3
source

Depends on relative or absolute position. And in the Google example, this is more complicated, but not so difficult, the controls to the right of the panel move after the animation is complete.

0
source

More articles:


All Articles