3 ms·
This should work: <input type="checkbox" /> <div style="background-image: url('http://voting-url.com')"></div> div { display: none; } input:che
by jonnyscholes 11y ago
This should work:
<input type="checkbox" />
<div style="background-image: url('http://voting-url.com')"></div>
div {
display: none;
}
input:checked + div {
display: block;
}
A background-image won't be requested unless it is visible. (This is why lots of peoples on-hover icons flicker if they don't spritemaps, SVGS or iconfonts).
Edit: Obviously you'd style it to make it pretty :p
Edit 2: For accessibility you'd probably want a visibly hidden - but visible to screen readers - anchor that votes.
Edit 3: Looks like chrome pre-fetches things even when they're not visible now. Presumably to fix all those flickery icons out there :(