Problema con la visibilidad: oculto en la función jquery slidedown ()

Cuando estoy usando display:none to a div and using slidedown function of JQuery to slide the div then it works but the divs get scattered on display:none ,instead of this when i am Visibilty:none to a div then the other divs do not scatter but the JQuery does not works.

#slider {
    overflow:hidden;
    position:relative;
}
.form-notice {
    display:none;
    float:left;
    width:24.3%;
}

preguntado el 12 de febrero de 14 a las 05:02

please provide fiddle -

Leer stackoverflow.com/questions/133051/… -

3 Respuestas

An immediate solution can be: First Add margin-left to your slider class

 .slider {
     float: left;
    margin-top: 0;
    width: 47.3%;
    margin-left: 329px;
    }

And set it auto dentro de esta función:

$("#request").click(function(){
      $(".form-notice").slideDown();
      $(".slider").css("margin-left","auto");
 });

Respondido 12 Feb 14, 06:02

display: none; takes the element out of the flow of the document, so it does not retain any block level positioning on the page. visibility: hidden; simply makes the element invisible, but it still takes up the same space on the page. The built-in .slideDown() método (junto con .slideUp() y .slideToggle() ) make use of display:none.

En su lugar, intente usar el .animate() method on the opacity css property and maybe chain a .css() method to it that gives it visibility: hidden; as a backup for older browsers.

Respondido 12 Feb 14, 05:02

may i add this method to jquery .firstly i set method to hide on load and chain it with slideup() - átomo

.slideUp() will cause the matched element to have display: none;, so that will remove it from the document flow. If you don't want this to happen, try this: $('button').eq(0).click(function() { $('p').slideUp(); }); $('button').eq(1).click(function() { $('p').animate({'opacity': 0}); }); JSFiddle - danwarfel

la diferencia entre display:none y visibility:none es que el display:none not fill the place where you placed a div but visibility:none occupy the place, and slide property add a display:none y display:block to the element after animation is complete. So its better to use display propiedad en lugar de visibility.

Respondido 12 Feb 14, 05:02

but my problem is with div. the other divs get scattered thats the problem. - átomo

so you have to use animation instead of slide to use visibility. - Arjun

and also you can use podition absolute to the div which you want to slide. this does not affect the another divs. - Arjun

Intenta hacer esto: $('p').animate({'opacity': 0});. Vea JSFiddle - danwarfel

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