Selectores ocultos de jQuery

Question

Cuando oculto una selección:

$("#someselector").hide();

Normalmente lo pongo en la parte inferior.Cuando aparece esa página web, por un breve momento veo la selección oculta.Luego desaparece, como debería.

Eso no es exactamente lo que quería ver.

¿Hay alguna manera de detener esa vista rápida de la selección "oculta"?

Answer 1

La razón por la que ve el elemento oculto cuando la página se está cargando es porque tiene que esperar a que se descargue la página y a que se procese el javascript antes de que llegue al código que oculta ese elemento.Si el estado inicial del elemento está oculto, simplemente configure el CSS para que no muestre ninguno.La hoja de estilo en el encabezado se procesa antes que el html, por lo que cuando se procesa el html no mostrará ese elemento.

Establezca el estilo en el elemento del archivo CSS: (sin usar jQuery)

 #someselector{
        display:none;
    }

...o crear una clase oculta

.hide{
   display:none;
}

<div id="someselector" class="hide">content</div>

...o establecer estilo en línea (no recomendado)

<div id="someselector" style="display:none;">content</div>

$('#algúnselector').show();y $('#someselector').hide();seguirá funcionando igual.

Answer 2

En lugar de poner el código de escondite en la parte inferior, lo puso en un archivo .js incluido en la cabeza (o, si su sitio es pequeño, en línea JS en la cabeza) y retrasar su aparición usando $(document).ready(). Leyendo sobre caso ready la pena también!

Answer 3

Trate de ponerlo dentro de una función $ (document) ready (). (Que debe estar en la cabeza)

De este modo se debe conseguir oculta antes de que aparezca la página ...

Answer 4

Cuando se le llama hide()? ¿Estás haciendo lo que en $(document).ready / $(handler)? Si es así, entonces no merece la pena verlo.

Answer 5

La forma más rápida de ocultarlo con javscript es poner el guión inmediatamente después del elemento en el marcado ...

<div id="someselector"></div>
<script type="text/javascript">$("#someselector").hide();</script>

Usted probablemente está utilizando actualmente el evento ready documento, pero que no se dispara hasta que todo el DOM ha sido construida.

No es una buena idea utilizar un enfoque display:none CSS, ya que el elemento no se mostrará con Javascript desactivado. Si eso no es una preocupación para su sitio, entonces no dude.