It would be nice to have a way of seeing where a link is pointing when hovering over i

Display link targets about multi HOT 1 CLOSED

kofigumbs commented on May 18, 2024 2

Display link targets

from multi.

Comments (1)

kofigumbs commented on May 18, 2024

This can be implemented entirely with the customCss feature. Here's a simple example:

a:hover::after {
  content: attr(href);
  position: fixed;
  left: 4px;
  bottom: 4px;
  padding: 4px;
  font-size: 12px;
  font-family: -apple-system, BlinkMacSystemFont;
  font-weight: normal;
  color: black;
  background: ghostwhite;
  border: solid 1px black;
  border-radius: 1px;
}

And here's the URI-encoded version if you just want to drop it into your config:

data:,a%3Ahover%3A%3Aafter%20%7B%0A%20%20content%3A%20attr%28href%29%3B%0A%20%20position%3A%20fixed%3B%0A%20%20left%3A%204px%3B%0A%20%20bottom%3A%204px%3B%0A%20%20padding%3A%204px%3B%0A%20%20font-size%3A%2012px%3B%0A%20%20font-family%3A%20-apple-system%2C%20BlinkMacSystemFont%3B%0A%20%20font-weight%3A%20normal%3B%0A%20%20color%3A%20black%3B%0A%20%20background%3A%20ghostwhite%3B%0A%20%20border%3A%20solid%201px%20black%3B%0A%20%20border-radius%3A%201px%3B%0A%7D

This implementation might break if your webpage also styles a::after. Also, it doesn't expand relative links. You could definitely write something more robust with customJs though.

from multi.

Recommend Projects