Is it possible to style a title? (and with CSS or js?)

javascript html css styling
Trufa picture Trufa · Dec 8, 2010 · Viewed 33.3k times · Source

I was wondering if it was possible to style a title:

<a href="#" title="This is a title">Hello</a>

The styling question has two aspects:

  • Text formatting / encoding (Which I guess is possible SO does it in questions*).
  • The Tooltip styling, can you make it bigger? other colors? etc.

And the other issue I have is how do you "point" to title?

  • From CSS
  • From Javascript / jQuery

Thanks in advance!

*What I ment by text formatting / encoding:

alt text

Answer

Phrogz picture Phrogz · Dec 8, 2010

You can put newlines in your title attribute via HTML entities to force a line break in the text. Most browsers these days support this. This is the only change you can make to the native tooltip display of the browser.

<a href="real_link" title="check&#13;&#10;this&#13;&#10;out">foo bar</a>

See the above example on a web page.

As others have pointed out, there exist a large number of plugins for various JS libraries for making custom HTML tooltips which are styleable. Here is the top hit for the Google search "jquery tooltip plugin", reviewing 10 such plugins.

Related questions

Retrieve the position (X,Y) of an HTML element relative to the browser window

I want to know how to get the X and Y position of HTML elements such as img and div in JavaScript relative to the browser window.

Read More
Set cookie and get cookie with JavaScript

I'm trying to set a cookie depending on which CSS file I choose in my HTML. I have a form with a list of options, and different CSS files as values. When I choose a file, it should be saved …

Read More
Failed to load resource: the server responded with a status of 404 (Not Found)

I can't solve my link problem. Could you help on to this to link CSS and JS File? CSS: <link href="../Jquery/jquery.multiselect.css" rel="stylesheet"/> <link href="../Jquery/style.css" rel="stylesheet" /> <link …

Read More