Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript][CSS] Wykonywanie animacji css w kółko za pomocą JS
troian
post
Post #1





Grupa: Zarejestrowani
Postów: 184
Pomógł: 2
Dołączył: 3.02.2013

Ostrzeżenie: (0%)
-----


Witam, mam napisaną animację w css która sprawia że zdjęcie [div] powiększa się oraz zmniejsza, oto mam pytanko czy jest możliwość aby w JS wywoływać co np 30 sek tą animację? Tak aby się powtarzała.

Pierwsze wywołanie animacji
Kod
div.logo, div.tekst{opacity:0;-webkit-animation-name:bounceIn;animation-name:bounceIn;-webkit-animation-duration:750ms;animation-duration:750ms;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-fill-mode:forwards;animation-fill-mode: forwards;}


Kod Animacji
Kod
@-moz-keyframes fullexpand {0%{width:0px;}100%{width:100vh;}}
@-webkit-keyframes fullexpand {0% {width:0px;}100%{width: 100vh;};}
@-webkit-keyframes bounceIn{0%{opacity: 0;-webkit-transform: scale(0.3) translate3d(0,0,0);transform: scale(0.3) translate3d(0,0,0);}50%{opacity: 0.9;-webkit-transform: scale(1.3);transform: scale(1.3);}80%{opacity: 1;-webkit-transform: scale(0.89);transform: scale(0.89);}100%{opacity: 1;-webkit-transform: scale(1) translate3d(0,0,0);transform: scale(1) translate3d(0,0,0);}}
@keyframes bounceIn{0%{opacity: 0;-webkit-transform: scale(0.3) translate3d(0,0,0);transform: scale(0.3) translate3d(0,0,0);}50%{opacity: 0.9;-webkit-transform: scale(1.3);transform: scale(1.3);}80%{opacity: 1;-webkit-transform: scale(0.89);transform: scale(0.89);}100%{opacity: 1;-webkit-transform: scale(1) translate3d(0,0,0);transform: scale(1) translate3d(0,0,0);}}


Ten post edytował troian 18.02.2015, 23:00:03
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
freewalker
post
Post #2





Grupa: Zarejestrowani
Postów: 90
Pomógł: 4
Dołączył: 14.02.2015

Ostrzeżenie: (0%)
-----


oo widzę, że nowa firma startująca z usługami programowania, gdzie właściciele mają problem z podstawami, a później klienci przychodzą "do nas" bo ktoś nie dał rady i zamiast poprawiać stronę "takich" firm okazuje się, że lepiej napisać ją od nowa (IMG:style_emoticons/default/wink.gif)

Nie ma, że w JS ci słabo, jeśli startujesz z takim projektem to polecam JS i jQuery - bez tego za dużo dynamiki nie osiągniesz w programowaniu stron, a co dopiero mówić o przesiadce i zrozumieniu HTML5, na który w końcu będziesz musiał się w przyszłości przerzucić (IMG:style_emoticons/default/tongue.gif)

Nie uznaj tego posta jako dogryzanie, a tylko jako dobrą radę.

Efekt jaki chcesz da się szybko osiągnąć - http://api.jquery.com/animate/
jQ nie jest trudne i nawet nie znając JS możesz szybko się go nauczyć.

Pozdrawiam i życzę sukcesów
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 15.10.2025 - 13:04