4 ms·
How would you make the button send a request without js and without navigating to another page? Maybe css to load an image on :active or is there some better w
by peq 5y ago
How would you make the button send a request without js and without navigating to another page?
Maybe css to load an image on :active or is there some better way?
- chrismorgan 5y agoHere are two robust techniques that I haven’t seen actually employed in production for maybe fifteen years: ① A submit button or link targeting an iframe which is visually hidden. (Or even don’t hide it. If only seamless iframes had happened, or any other way of auto-resizing an iframe: relevant spec issues are https://github.com/whatwg/html/issues/555 https://github.com/whatwg/html/issues/555 and https://github.com/w3c/csswg-drafts/issues/1771 https://github.com/w3c/csswg-drafts/issues/1771.) ② A submit button or link to a URL that returns status 204 No Content. (CSS image loading in any form is not as robust because some clients will have images disabled. background-image is probably (unverified claim!) less robust than pseudoelement content as accessibility modes (like high contrast) are more likely to strip background images, though I’m not sure if they are skipped outright or load and aren’t shown. :active is neither robust nor correct: it doesn’t respond to keyboard activation, and it’s triggered on mouse down rather than mouse up. Little tip here for a thing that people often get wrong: mouse things activate on mouseup, keyboard things on keydown.)
- the_gipsy 5y agoMhhh, iframes all the way down. Could make a nice experiment.
- cmg 5y agoYep: .button:active { background-image: url('/some-reference-thats-actually-a-tracker'); }