¿Cómo evitar que una caja flotante se mueva cuando la caja anterior está oculta?

i have two boxes. both are floating to left. both the boxes have a function such that when a box is clicked, it hides. now the problem is that when box 1 is clicked, box 2 moves to take its place, that's the problem. i don't want the box 2 to move even a bit. Please help! here's a demo or your understanding - http://jsfiddle.net/VdpJn/

preguntado el 09 de marzo de 12 a las 15:03

2 Respuestas

The first box's onclick should read, $(this).css("visibility", "hidden");

respondido 09 mar '12, 15:03

Unfortunately, "display: none" removes the related element from the rendering process completely, which is not the case with "visibility: hidden" - the former retains the box used by the element but does not render its contents. You could easily write your own function to handle toggling using the "visibility" property in place of "display". - Alejandro Pavlov

http://jsfiddle.net/joshuamartin/VdpJn/6/

<html>
    <body>
        <div class="box" onclick="$(this).css('visibility', 'hidden')">Box 1</div>
        <div class="box" onclick="$(this).css('visibility', 'hidden')" >Box 2</div>
    </body>
</html>​

respondido 09 mar '12, 15:03

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.