Is there a way to make an icon appear when hovering over an anchor link on a webpage?
I tried a code snippet that I thought would achieve the desired effect, but it ended up leaving a gap. The text should expand in size as you hover over the anchor link.
Can someone guide me on how to accomplish this?
a:after {
content:" 🔗";
position: relative;
opacity: 0;
left: -20px;
-webkit-transition: all 250ms;
transition: all 250ms;
}
a:hover:after {
opacity: 1;
left: 0px;
-webkit-transition: all 250ms;
transition: all 250ms;
}
<p>This is a <a href='http://stackoverflow.com'>Test</a>. And I would like to link you on <a href='http://stackoverflow.com'>Stackoverflow</a> if you have any questions.</p>