-
Notifications
You must be signed in to change notification settings - Fork 779
Description
In #12581 (comment) we resolved to use the same name scoping mechanism for the various specs that have scoped names: timeline-scope, anchor-scope, and trigger-scope. I still think this is a good thing to do so that developers don't have to navigate nuanced differences between name scoping.
Proposal:
Make position-anchor, animation-timeline, animation-trigger refer to the nearest ancestor declaring that name if found before reaching the *-scope element.
I think this is one aspect of timeline scopes that we should adopt for anchor scopes and trigger scopes. It is confusing for developers to have to add an explicit scope when referring to an ancestor. E.g.
<style>
.item {
view-timeline-name: --item;
}
.animation-target {
animation-name: parallax;
animation-timeline: --item;
}
</style>
<div class=item>
<div class=animation-target></div>
</div>
<div class=item>
<div class=animation-target></div>
</div>
<div class=item>
<div class=animation-target></div>
</div>This will significantly de-risk the potential compat issues of updating timeline-scope as well as make anchor-scope and trigger-scope easier to use. E.g. here's a demo where the anchor intends to use the nearest position-anchor but right now requires developers explicitly add anchor-scope: https://codepen.io/flackr/pen/azZJvyL
@andruud FYI
Metadata
Metadata
Assignees
Labels
Type
Projects
Status