1

What's the best way to customize HTML/CSS tooltips? (I mean an easy, cross-browser solution.)

I need to reduce the fade-in delay and change the style. (Also, could you suggest a good jQuery plug-in for it?)

Amos M. Carpenter
  • 4,848
  • 4
  • 42
  • 72
aneuryzm
  • 63,052
  • 100
  • 273
  • 488
  • If anyone coming across this is considering non-JS/jQuery solutions, have a look at [this answer](http://stackoverflow.com/a/17391243/983430) to a related question. Working fiddle: http://jsfiddle.net/4k90opzv/ – Amos M. Carpenter Dec 14 '15 at 05:39

3 Answers3

3

I have used qTip and the older version, Simpletip before and they work pretty well in all browsers (even IE6!).

The documentation is really good and you can configure the fade in/out delay: http://craigsworks.com/projects/qtip/docs/reference/#show

Style reference: http://craigsworks.com/projects/qtip/docs/tutorials/#styling

wsanville
  • 37,158
  • 8
  • 76
  • 101
0

Using jQuery, you could get the title attribute of an object and add an element with that value. There is a little gem from jQuery: Novice to Ninja (SitePoint 2010). I am unsure if I am allowed to post it here, although the the code itself has been made public on sitepoint by the authors. Download the archive and see chapter_05\17_simple_tooltips. It's 25 lines long and works great.

nc3b
  • 15,562
  • 5
  • 51
  • 63
  • I found this comment, and was interested in other code examples. SitePoint's github: https://github.com/spbooks – onebree May 27 '15 at 14:50
0

This is another tooltip plugin worth looking at, http://code.drewwilson.com/entry/tiptip-jquery-plugin

Lawrence
  • 447
  • 3
  • 11