Animacje JS bez użycia processing.js

Question

Cześć,

Chciałbym prosić o wskazówkę, jakich metod można użyć do zrobienia animacji w JS jakie są np. na tumblr po kliknięciu na 'serduszko' :D Łatwo coś takiego zrobić na płótnie z użyciem processing.js, ale domyślam się, że są lepsze sposoby na zrobienie podobnych efektów bez zaciągania "armaty, aby zabić komara" ;)

A jeśli się mylę i processing będzie do tego wskazany również proszę o sprostowanie.

Answer 1

Ogolnie to do wykonania większości animacji w ogóle nie trzeba zaciągać js'a. Wystarczy sam css, i pseudo elementy selekterów. Oraz nauczenie się przez praktykę oraz doświadczenie innych(aby szybciej zrozumieć działanie) takich rzeczy jak: Transition, Transforms, timing function etc. Ale wszystko na spokojnie, musisz dać umysłowi trochę czasu na przetrawienie tego, oraz dużo ćwiczyć. :P

Comments

Można też zdefiniować animację w CSS, a potem tylko javascriptem albo jQuery dodać/usunąć klasę, która posiada animację.

W jQuery jest fajna funkcja toggleClass():

$(selektor).zdarzenie(function(){
    $(this).toggleClass("nazwa_klasy");
});

będzie ona dodawała klasę gdy jej nie ma, a usuwała ją gdy jest.

Mam nadzieję, że pomogłem :)

---

Dzięki za odpowiedzi - obie były pomocne. Udało mi się to rozgryźć dodając element z efektem (z animacją) na @keyframes, a po zakończeniu animacji również za pomocą JS ten element usunąć.