Drukowana wersja tematu

Kliknij tu, aby zobaczyć temat w orginalnym formacie

Forum PHP.pl _ CSS _ CSS - keyframes

Napisany przez: soliniak 17.02.2017, 19:38:55

Wieczór,

Jak pozbyć się tej pauzy w trakcie animacji?
https://jsfiddle.net/e8ohze4h/

Dzięki za pomoc, pozdrawiam.

Napisany przez: trueblue 17.02.2017, 19:45:03

Zmienić easing na linear, albo zmienić klatki na 0 -20px, 50% 20px, 100% -20px

Napisany przez: soliniak 17.02.2017, 21:09:02

Zależy mi aby punkty przemieszczały się płynnie w odniesieniu do osi (zaznaczyłem na czerwono).
Ustawiając punkt startu na -20px wychodzi lipa. Linear nie wygląda tak dobrze jak ease.
https://jsfiddle.net/e8ohze4h/2/

Napisany przez: trueblue 17.02.2017, 22:19:03

W zerze będzie przy 25%, czyli trzeba opóźnić o 0.15.

Kod
animation: plemnik .6s ease ($i/10 - 0.15)+s infinite;
Tak?

Napisany przez: soliniak 17.02.2017, 22:24:39

Niestety nie działa prawidłowo. Nawet po wyłączeniu opóźnienia wszystkie punkty poruszając się równocześnie "zacinają" się w momencie przejścia 100% a 0%.
Efekt jest minimalny ale irytujący :/

Napisany przez: trueblue 17.02.2017, 22:34:22

W Twoim przykładzie nadal ramki są na 0, 33, 66 i 100%.

Napisany przez: soliniak 17.02.2017, 22:43:08

Tak. link: http://codepen.io/anon/pen/jyoGOr

Napisany przez: trueblue 17.02.2017, 22:46:45

Ale ja to wiem.
Zmień tak jak pisałem.

Napisany przez: soliniak 17.02.2017, 23:00:44

Chodzi Ci o to żeby kod wyglądał tak?
http://codepen.io/anon/pen/jyoGOr?editors=0110

Napisany przez: trueblue 17.02.2017, 23:02:04

Tak.
Co jest nie tak?

Napisany przez: soliniak 17.02.2017, 23:19:37

Animacja nie zaczyna się od "punktu startowego" czyli na osi linii tylko punkty spadają jakby z góry, a niestety nie o to mi chodzi sad.gif
Chcę żeby animacja zaczynała się w miejscu "spoczynku" punktów na osi linii, a potem trwała nieprzerwanie i płynnie.
Chyba będę musiał zadowolić się linear'em jako animation-timing-function :/

Napisany przez: trueblue 18.02.2017, 10:13:45

http://codepen.io/anon/pen/RKmJqP?editors=0110

Napisany przez: soliniak 18.02.2017, 12:14:12

Wciąż się zacina...

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)