jQuery .fadeIn () przy ładowaniu strony?

Próbuję skonfigurować jakiś kod, tak że najpierw mam ukryty kod, a potem pojawia się po załadowaniu strony.

Mam następujący kod HTML:

<div class="hidden">
<p>This is some text.</p>
</div>

Wtedy też mam ten kod CSS, który ukrywa<div>.

div.hidden
{
    display: none
}

Wreszcie mam moje jQuery:

$(document).ready(function() {
    $('div').fadeOut(1);
    $('div').removeClass('hidden');
    $('div').fadeIn(1000);
});

Liczyłem na to, że pierwsze .fadeOut () zniknie, removeClass powstrzyma CSS przed ukryciem, a ostateczne .fadeIn () z powrotem powróci na stronę. Niestety to nie zadziałało.

Możesz zobaczyć kod tutaj:Skrzypce

Czy ktoś może mi powiedzieć, jak zachować<div> ukryte do momentu załadowania strony, a następnie zanikania przy użyciu jQuery?

Dzięki!

questionAnswers(4)

yourAnswerToTheQuestion