Bug 184087 - Negative animation-delay isn't picked before an animation has started
Summary: Negative animation-delay isn't picked before an animation has started
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Animations (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
Keywords: InRadar
Depends on:
Reported: 2018-03-28 08:58 PDT by Matias N
Modified: 2018-03-28 09:14 PDT (History)
4 users (show)

See Also:


Note You need to log in before you can comment on or make changes to this bug.
Description Matias N 2018-03-28 08:58:46 PDT
In addition to the problems with Webkit Negative Animation Delays...

It would be very helpful is Webkit (Safari in this case) would allow itself to change the negative delay value as much as needed before an animation starts.

Chrome/Firefox allow for this and in turn you can basically scrub a @keyframes animation.

// file: index.js

// assign a keyframe to an element
element.style.setProperty('animation', 'myKeyframe ' + ANIMATION_DURATION);

// pause the video before it kicks off
element.style.setProperty('animation-play-state', 'paused');

// change the delay based on some <input type="range"> input

// rangeInput = <input type="range" min="0" max="1" step="0.01">
rangeInput.addEventListener('input', function(e) {

  // this DOES NOT work in Webkit/Safari (Chrome and Firefox are good).
  element.style.setProperty('animation-delay', this.value * ANIMATION_DURATION);

Comment 1 Radar WebKit Bug Importer 2018-03-28 09:14:28 PDT