show twitter images' alt text on hover
show twitter alt text by notafile
Details
Authornotafile
LicenseNo License
Categorytwitter
Created
Updated
Size994 B
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
stolen from: https://github.com/alexwlchan/highlight-twitter-alt-text so that I can more easily share it between devices
Source code
/* ==UserStyle==
@name show twitter alt text
@version 20211008.12.20
@namespace userstyles.world/user/notafile
@description show twitter images' alt text on hover
@author notafile
@license No License
==/UserStyle== */
@-moz-document domain("twitter.com") {
/** This snippet adds an overlay to images on Twitter, so the alt text
* (if there is any) is shown at the top of an image.
*/
div[data-testid="tweetPhoto"]:not([aria-label="Image"]),
div[data-testid="previewInterstitial"]:not([aria-label="Embedded video"]) {
margin: 0 !important;
}
/** If you want to see alt text all the time, remove :hover from these two rules */
div[data-testid="tweetPhoto"]:hover:not([aria-label="Image"]):after,
div[data-testid="previewInterstitial"]:hover:not([aria-label="Embedded video"]):after {
content: attr(aria-label);
background: rgba(0, 0, 0, .75);
color: #fff;
padding: 10px;
font-family: sans-serif;
line-height: 130%;
z-index: 1;
}
}