Confirmed users
166
edits
(Add some issues about Web Animations) |
|||
Line 66: | Line 66: | ||
# The one with the highest priority wins (CSS; SVG w/ additive="replace") | # The one with the highest priority wins (CSS; SVG w/ additive="replace") | ||
# Add them together: lower + higher (SVG w/ additive="sum") | # Add them together: lower + higher (SVG w/ additive="sum") | ||
# Interpolate from the "underlying value" (result of lower priority animations) to the destination value (SVG "to-animation"; CSS appears to do this but actually snapshots the underlying value) | # Interpolate from the "underlying value" (result of lower priority animations) to the destination value (SVG "to-animation"; CSS appears to do this but actually snapshots the underlying value and does (1)) | ||
'''Issue:''' How do we represent these in the model? | '''Issue:''' How do we represent these in the model? | ||
'''Approach A) Offer three compositing modes: replace ( | '''Approach A) Offer three compositing modes: replace (1), add (2), and merge (3)''' | ||
* Complex. Especially for the | * Complex. Especially for the '''very''' common case of wanting to simply animate "to" a value. You have to set up a merge operation for this or have a constructor that does magic behind the scenes to do it for you. | ||
* Adds new functionality. | * Adds new functionality. | ||
'''Approach B) Offer two compositing modes: replace | '''Approach B) Offer two compositing modes: replace (1) or add (2)''' | ||
When you have a keyframes animation with no 0%/100% do ( | When you have a keyframes animation with no 0%/100% do (3) | ||
* Simple. | * Simple. | ||
* Similar to CSS with regards to missing keyframes (but | * Similar to CSS with regards to missing keyframes (but subtly different since it doesn't snapshot the underlying value). | ||
* Concern about it being incomplete | * Concern about it being incomplete—you can have "holes" at the ends of the keyframes but not in the middle. | ||
Line 93: | Line 93: | ||
* Doesn't help with other types of animations like path animations. | * Doesn't help with other types of animations like path animations. | ||
* Difficult to set behavior across-the-board (add a default compositing mode as well?) | * Difficult to set behavior across-the-board (add a default compositing mode as well?) | ||
* | * Syntax like the above wouldn't work: extra constructs (e.g. <code>add('6px')</code>) would probably be required | ||
===Issue 2: Separating play control from animation definition=== | ===Issue 2: Separating play control from animation definition=== |