Dynamiczna animacja wybicia piłki z określoną mocą, napisania z użyciem HTML, CSS (keyframes) i JS.
Dynamiczna animacja wybicia piłki z określoną mocą, napisania z użyciem HTML, CSS (keyframes) i JS.
Aby naciągnąć sprężynę, należy przycisnąć i przytrzymać przycisk w prawym górnym rogu aplikacji. Pasek pod przyciskiem pozwala na kontrolowanie mocy uderzenia. Kiedy osiągniemy preferowaną moc, wystarczy puścić przycisk naciągania sprężyny - wówczas uruchomi się animacja uderzenia piłki, a w prawym górnym rogu wyświetli się osiągnięta moc uderzenia w procentach. Po wykonaniu animacji wraca ona do stanu poprzedniego i umożliwia powtórzenie czynności.
Aplikacja do osiągnięcia animowanego efektu wykorzystuje częściowo CSS (keyframes
), a częściowo JavaScript (dynamiczne zmiany właściwości).
Projekt ma przede wszystkim charakter demonstracyjny i dydaktyczny, ukazujący możliwości tworzenia animacji przy użyciu CSS i JavaScript. Zastosowane w nim skrypty, mogą w przyszłości posłużyć jako elementy gry przeglądarkowej, takiej jak bilard, golf czy rzutki.
Preview dostępne na serwerze własnym (eGildia Graczy)