Fix rabbit animation transform origin and improve GIF reset logic
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 40s
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 40s
This commit is contained in:
@@ -197,6 +197,8 @@ function animateRabbit(rabbit) {
|
||||
|
||||
rabbit.style.transition = 'none';
|
||||
const transformScale = startFromLeft ? 'scaleX(-1)' : '';
|
||||
// Fix bounding box center-of-gravity shift when graphic is flipped
|
||||
rabbit.style.transformOrigin = startFromLeft ? '59% 50%' : '50% 50%';
|
||||
rabbit.style.transform = `translateX(${currentX}vw) ${transformScale}`;
|
||||
|
||||
const loopDurationMs = jumpDurationMs + pauseDurationMs;
|
||||
@@ -211,10 +213,10 @@ function animateRabbit(rabbit) {
|
||||
|
||||
if (!startTime) {
|
||||
startTime = timestamp;
|
||||
// resetting gif, forces the browser to restart the GIF from the first frame (crucial for syncing hops with movement)
|
||||
// resetting gif, appending a timestamp cache-buster forces the browser
|
||||
// to reload and start the GIF strictly from the first frame.
|
||||
const currSrc = rabbit.src.split('?')[0];
|
||||
rabbit.src = '';
|
||||
rabbit.src = currSrc;
|
||||
rabbit.src = currSrc + '?t=' + Date.now();
|
||||
}
|
||||
|
||||
const elapsed = timestamp - startTime;
|
||||
|
||||
Reference in New Issue
Block a user