Re: [csswg-drafts] [animation-triggers-1] Multiple named triggers (#13710)

> I feel like closing this may be premature? In the discussion, we talked about how this might be able to work for timeline triggers but that we needed specific details until we could decide if that was a reasonable thing to do.

Right, I thought we scope this issue to what we resolved on, and open additional issues for the rest, but I'm fine with furhter exploring here. Removed the tag.

> IF you can combine arbitrary triggers, then I think it would work like this. The trigger itself has a state, and any number of source triggers that can activate or deactivate that state. The source timeline triggers themselves have a state so that they can enter the entry range, and remain active until they leave the exit range. They generate events that change the main trigger's state when these changes happen.

Yes, that's what I was aiming for, that timeline triggers simply emit entry and exit events that can affect the trigger's state. I remembered we tried to do that before and it wasn't possible, but if we can solve it like that it would be great.

> This would effectively makes combining triggers into a single name like a logical OR

Yes, of course. It already has to be an OR, otherwise it's not very useful.

> and as discussed prior listing multiple triggers on an animation-trigger is the equivalent of a logical AND.

We did say that for `timeline-trigger`s we want a logical AND in order to achieve an intersection of axes. I don't recall whether it was via multiple triggers or timelines.

So we have:

- `event-trigger`: `none | [ <event-trigger-name> <event-trigger-source> ]#`
- `timeline-trigger`: `none | [ <timeilne-trigger-name> <timeilne-trigger-source> <timeilne-trigger-activation-range> [/ <timeilne-trigger-active-range>]? ]#`
- `animation-trigger`: `[ none | [ <dashed-ident> <animation-action>+ ]+ ]#`

Now we have:

1. multiple names of same triggers that merge as OR.
2. multiple triggers for same animation, via `animation-trigger`, also OR - but perhaps if we add the new merging mechanism we should reconsider going back to a single trigger with multiple attachments?
3. multiple event trigger declarations on `event-trigger`, but those are just event attachment declarations.
4. multiple timeline trigger declarations on `timeline-trigger`, these should be the same as 3, but, ideally, we want to allow intersection of multiple timelines (and ranges). 

It could become a bit complex. At best we want multiple timelines on same trigger to act as a logical AND, but I'm concerned with the syntax for that becoming something like:

```css
.timeline {
  timeline-trigger: --v view(x) contain / contain view(y) cover / cover;
  /* or with pointer() */
  timeline-trigger: --p pointer(x) cover / cover pointer(y) cover / cover;
}
```

WDYT?

-- 
GitHub Notification of comment by ydaniv
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/13710#issuecomment-4141974155 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 27 March 2026 11:35:14 UTC