[csswg-drafts] [css-view-transitions] View transitions without JavaScript (#11675)

benface has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-view-transitions] View transitions without JavaScript ==
Here's a potentially crazy idea, but I would love a way to harness the power of view transitions with CSS-only interactions such as `:hover`. For example, the following snippet could automatically move a kind of background "hover indicator" as different links are hovered:

```html
<nav>
  <a href="/home">Home</a>
  <a href="/about">About</a>
  <a href="/contact">Contact</a>
</nav>
```

```css
nav a:hover::before {
  content: '';
  position: absolute;
  inset: -8px;
  background-color: #eee;
  view-transition-name: link-hover-indicator;
  view-transition-trigger: auto; /* this would mean it auto-detects when a different element/pseudo-element gets the same `view-transition-name` and transitions between the old and the new one */
}
```

I am very much expecting this to be closed as not technically feasible given the current design of view transitions, but I had to propose it. 😁

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11675 using your GitHub account


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

Received on Friday, 7 February 2025 19:57:47 UTC