From 4b0c2703b18aec9ef2e87d5be3afce79f56817d9 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Paul=20H=C3=A4nsch?= Date: Wed, 24 Mar 2021 22:01:22 +0100 Subject: [PATCH] simplified animation stepping --- style.css | 26 +++----------------------- 1 file changed, 3 insertions(+), 23 deletions(-) diff --git a/style.css b/style.css index 7eda95c..dd67361 100644 --- a/style.css +++ b/style.css @@ -67,31 +67,11 @@ body { margin-left: 50%; } .itemlist .list:hover img { - animation-name: thumbscroll; - animation-duration: 10s; - animation-iteration-count: infinite; + animation: thumbscroll 8s steps(10, end) infinite; } @keyframes thumbscroll { - 0% { transform: translate(-05%, 0); } - 9.99% { transform: translate(-05%, 0); } - 10% { transform: translate(-15%, 0); } - 19.99% { transform: translate(-15%, 0); } - 20% { transform: translate(-25%, 0); } - 29.99% { transform: translate(-25%, 0); } - 30% { transform: translate(-35%, 0); } - 39.99% { transform: translate(-35%, 0); } - 40% { transform: translate(-45%, 0); } - 49.99% { transform: translate(-45%, 0); } - 50% { transform: translate(-55%, 0); } - 59.99% { transform: translate(-55%, 0); } - 60% { transform: translate(-65%, 0); } - 69.99% { transform: translate(-65%, 0); } - 70% { transform: translate(-75%, 0); } - 79.99% { transform: translate(-75%, 0); } - 80% { transform: translate(-85%, 0); } - 89.99% { transform: translate(-85%, 0); } - 90% { transform: translate(-95%, 0); } - 100% { transform: translate(-95%, 0); } + from { transform: translate(-05%, 0);} + to { transform: translate(-105%, 0);} } .itemlist .list label { -- 2.39.2