Animacja licznika

0

Dzień dobry wszystkim !

Ten problem nurtuje mnie od jakiegos juz czasu. Proszę spójrzcie, stworzylem na szybko jsfiddla, azeby dokladniej wytlumaczyc problem - https://jsfiddle.net/zr2dLbge/

Chciałbym aby cyfry animowane byly tylko w jedna strone, tj gdy mamy "0" -> "9" animacja leci do góry przez wszystkie cyfry az do 9, lecz gdy mamy juz "9" -> "1" to animacja wraca w druga strone. chcialbym to zrobic tak, aby licznik animowany byl tylko w jedna strone, tzn z dolu do gory, nigdy na odwrot, lecz niestety brak mi juz pomyslow... Dzieki z gory za pomoc

0

Cóż, tutaj nie masz rolek, tylko pionowe paski [0-9], więc w oparciu o taką konstrukcję nie da się zrobić przewinięcia z 9 -> 0 inaczej niż w odwrotną stronę. Potrzebujesz czegoś bardziej złożonego. 10 divów z cyframi na każde pole licznika i skryptu manipulującego ich położeniem.

0

Mógłbyś rozwinąć proszę?

1

Potrzebujesz 10 elementów na każde okienko licznika i musisz z nich zrobić coś w rodzaju karuzeli. Podobnie jak tu:
title
Ale bez skrótów perspektywicznych.

Wersja alternatywna: 3 elementy na każde okienko, ale podmieniasz w locie wyświetlane w nich liczby.

2

W sumie to chciałem przysiąść i Ci to napisać, ale po co wynajdywać koło na nowo?

Rzuć proszę okiem na https://github.hubspot.com/odometer/docs/welcome/

1 użytkowników online, w tym zalogowanych: 0, gości: 1