[csswg-drafts] [selectors] Consider adding a :hover-drag pseudo selector (#11834)

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

== [selectors] Consider adding a :hover-drag pseudo selector ==
# The Problem
When creating dropzones to drag&drop things like files to, it is very common for web developers to listen to the drag-related HTML events (`dragenter`, `dragleave`...) to update the element's styles to indicate "You can drop this here!".
This seems like the job for a CSS selector.

# Why?
Having a selector that just does this (similar to the `:hover` selector) would be a very nice authoring convenience and probably also more robust in circumstances where the expected events might not fire.
Think: Does `dragleave` fire if the mouse leaves the window? if the element becomes inert? if it is removed?
Authors would not need to think about these details anymore, simplifying the process of setting this up.

It would also mean that styling drop areas can now be done with CSS only, which seems cleaner than having to register event listeners for it from JavaScript.

# Considerations
This should probably be mutually exclusive with the `:hover` selector itself since, at least in Firefox and Chrome, regular hovering does not happen during dragging of stuff.

I am not particularly invested in calling it `:hover-drag`, that's just the best I could come up with, maybe next to `:drag-target`. (although that one looks less like a hover equivalent for dragging)

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


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

Received on Wednesday, 5 March 2025 15:57:00 UTC