How to add hover or mouseover text (acronym not working)

  • Author
  • #424519


    So I’m not running my own code, just using a template but would like to figure out how to do hover text on text — just looking for a couple of simple lines I can put in the html for my posts.

    In particular, I have a number of phrases in Yiddish — and I want the translation to appear when someone mouses over them. I’ve figured out how to do this using the acronym tag — but it makes the phrase show up in allcaps. Is there a way to lose the caps — or another tag to use instead of acronym?


    The blog I need help with is



    The use of the acronym tag, for what you want, is not semantically correct. Try this instead.

    <a title="translation" style="cursor: help;">Yiddish word</a>

    Honestly, this solution is not semantically correct either, but is the better one for what you want.

    If you want these anchor tags to be different from the rest, then just add a color property, like this:

    <a title="translation" style="color: #f00; cursor: help;">Yiddish word</a>

    The code I put in my example will give you red; you’d need to change that to whatever color you like, of course.



    Thanks! That’s definitely better. One follow-up — is there a way to make it appear without the underline?



    Just add the text-decoration property:

    <a title="translation" style="color: #f00; cursor: help; text-decoration: none;">Yiddish word</a>

The topic ‘How to add hover or mouseover text (acronym not working)’ is closed to new replies.