2010-09-18 13 views
6

Tengo un objeto que deseo iniciar como oculto. He tratado de usar cada uno de estos estilos de a uno por vez. Los tengo en una clase, no como estilos en línea.JQuery: Comience el objeto como oculto de una manera que permita que .fadeIn() funcione

display:none; 

y

opacity:0;filter:alpha(opacity=0); 

Ahora, éstos tanto trabajado, obviamente, los objetos cargar oculto. El problema es que cuando los uso, la función JQuery .fadeIn() no funciona. De hecho, cuando configuro la opacidad a .5 (50), el fundido de entrada solo se desvanece a .5 (50).

Entonces, ¿a qué puedo asignarle el valor predeterminado para que la función .fadeIn() funcione?

Gracias!

+2

Si sólo utiliza 'pantalla: none' el' fadeIn() 'debería funcionar. Aquí hay un ejemplo: http://jsfiddle.net/n7FzR/1/ – user113716

+0

¿Estás seguro de que no estás tratando de 'fadeIn' un elemento secundario del elemento al que adjuntas esos estilos? –

Respuesta

8

Hola es el código de la versión

trabajo

HTML

<html> 
    <body> 
     <p>test</p> 
    </body> 
</html> 

jQuery

$(document).ready(function() { 
$('p').fadeTo('slow', 1, function() { 
     // Animation complete. 
    }); 
}); 

CSS

p{ 
    display:none; 
    opacity:0.0; 
    filter:alpha(opacity=0); 
} 
​ 

demostración en vivo

http://jsfiddle.net/2p2v4/

+0

muchas gracias señor – Nate

+0

Dependiendo de su diseño, puede que no desee comenzar con 'display: none;', y afortunadamente parece que funciona sin él. –

2

se puede utilizar a continuación por escrito o simplemente añadir su código en la parte inferior de la página

.fadeInOnLoad 
{ 
    display:none; 
} 

     <div class="fadeInOnLoad">iam visible after page is loaded</div> 

     jQuery(function(){ 
      // your fade in code, call it after dom is ready 
      jQuery('.fadeInOnLoad').fadeIn(); 
     }); 

Creo que su problema es

  • que está llamando fundido de entrada antes de la los elementos dom se crean en el navegador

  • o usando jQuery , La versión de Visual Studio, como recuerdo que hubo alguna cosa error en la opacidad de jQuery en la versión de Visual Studio

Cuestiones relacionadas