Ich habe ein Zufallszahlenrad von 0 bis 9. Das Rad dreht sich nach oben oder unten, um auf der Zufallszahl zu landen. Wie kann ich es so machen, dass das Rad nur abrollt? (Sobald es 9 erreicht, ist die nächste Zahl 0, 1, 2 ... 9, 0, 1, 2) ohne viele divs zu haben.
Ich habe Ihr Snippet ein wenig modifiziert, um das von Ihnen geforderte Verhalten zu erreichen.
Es gibt jedoch zwei Probleme. Zuerst brauchst du fast doppelt so viele Divs, um das Ding richtig zu animieren. Zweitens wird das transitionend
-Ereignis nicht in allen Browsern unterstützt , und manchmal muss es vorangestellt werden, wenn Sie es interessieren unterstützende Dinge wie IE & lt; 10, dann wird es nicht für Sie aus der Box funktionieren.
Wie in der anderen Antwort anstelle der Verwendung von transitionend
event vorgeschlagen, können Sie in Erwägung ziehen, nur die "Rad" -Position zurückzusetzen wenn die Schaltfläche angeklickt wird. Dies ist in Ordnung, aber es wird eine etwas ausgefeiltere Implementierung erfordern, da Sie sich (irgendwie) merken müssen, auf welche Position Sie zurücksetzen müssen.
Kauft dieses JsFiddle
ausHauptpunkt ist, das vorherige Element auf das letzte
zu setzenEtwas spät, aber ich hoffe, dass dir das weiterhilft.
Tags und Links javascript html css