Pokaż więcej js

Question

Cześć! Umieściłem na mojej stronie kod js, który po kliknięciu w przycisk pokazuje więcej zdjęć. Wygląda on tak

<script>
$(document).ready(function(){
    $("#button").click(function(){
        $(".more").toggleClass("active");
    });
});
</script>

Wszystko pięknie działa, tylko problem jest taki, że te zdjęcia  pojawiają się z prędkością światła i bez żadnej animacji. Czy jest możliwość nadania temu efektowi jakiejś ładnej animacji? Pozdrawiam :)

Answer 1

Możesz dodać w css jakieś efekty.

 

Albo użyć jquery

https://api.jqueryui.com/toggleClass/ - masz nawet coś takiego w example funkcji, której używasz

Comments

Bardzo dziękuję :)

Answer 2

Możesz sobie po prostu do tej Twojej klasy active podpiąć jakąś animację, np. zrobić coś w keyframes czy choćby jakieś proste transition itp. Kwestie animacji warto o ile się da, to trzymać w CSS i JS raczej zostawiać do ewentualnych podmian klas CSS.

Comments

Dziękuję bardzo :)

---

Zrobiłem coś takiego, ale nic nie działa niestety. Co źle robię?

.active
{
display: block;
transition: transform 1s ease-in-out;
}