animacja pojawienie ukrytych elementow

Question

Hej,

nie wiem jak ugryźć. Mam ukryte elemnty span na stronie ,które mają ustawione display: none;
chciał bym teraz aby pojawiły mi się wjezdzając od góry strony po kliknięciu przycisku.

Jak by do tego można było się zabrać?
wszytskie te elemny maja okreslona klasę dodatkową class="open"

Pomocy!!!!!

Answer 1

Spróbuj z JQuery:

$(document).ready(function(){
 $("#id_diva").click(function(){
 $(this).show().animate({
   top: "+=50"
 });
 });
});

 

Answer 2

Bez klasy open:

.element {
    opacity: 0;
    visibility: hidden;
    transform: translateX(50px);

    transition: all 0.2s
}

Z klasą open

.element.open {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

 

Answer 3

Witam.

$(document).ready(function(){
  $('button').click(function(){
    $('body').find( ":hidden" ).slideDown(1000);
  });
});