Comments on: Prototype based JavaScript tooltip

By: Constantin Boiangiu

Constantin Boiangiu — Fri, 04 May 2007 07:57:19 +0000

I like sweet titles too, but I will reiterate the previous comment:
It is broken and it clashes with every other script that relies on the title attribute. ESP. Any Lightbox style script. I was hoping for a solution that would let me use a â€œnice-tiltleâ€ script in conjunction with a lightbox script, but it seems non of them fit the bill. How about one with a â€œrelâ€ attribute so I can tell it where to be applied and have it leave everything else alone?

It’s kind of late to answer this but there is an answer. You needed to use rel? change this:
current[j].removeAttribute(’title’);
to this
current[j].removeAttribute(’rel’);
in sweetTitles.js and you’re done.

By: Gene Kelly

Gene Kelly — Wed, 14 Feb 2007 19:31:27 +0000

I guess they do not post code here.

By: Gene Kelly

Gene Kelly — Wed, 14 Feb 2007 19:30:32 +0000

Like Your Work your post inspired me to drop this script and write the following:

Javascript Code:

I get displayed on hover

Rollover Me

Its just that damn easy why load up on a hefty file. Style your hover div anyway you want.

Im a Cakephp fan.

Thanks,
Gene Kelly
Gkelly

By: sukesh

sukesh — Fri, 26 Jan 2007 04:00:28 +0000

By: Tvorba webu

Tvorba webu — Sun, 07 Jan 2007 09:08:22 +0000

Really, why is not an example of this seems-to-be great technique on this site?

By: JIRA: event manager

JIRA: event manager — Sun, 12 Nov 2006 17:46:10 +0000

[EVTMGR-5] Add tooltip support for events in calendar view

null Use Prototype base tooltip (http://ajaxian.com/archives/prototype-based-javascript-tooltip) to display events details in calendar view.

By: Jamie

Jamie — Wed, 01 Nov 2006 23:04:57 +0000

I like sweet titles too, but I will reiterate the previous comment:

It is broken and it clashes with every other script that relies on the title attribute. ESP. Any Lightbox style script. I was hoping for a solution that would let me use a “nice-tiltle” script in conjunction with a lightbox script, but it seems non of them fit the bill. How about one with a “rel” attribute so I can tell it where to be applied and have it leave everything else alone?

By: Links comentados via del.icio.us - 5 » Japs

Links comentados via del.icio.us - 5 » Japs — Mon, 30 Oct 2006 18:03:38 +0000

[...] O primeiro link de hoje: Prototype based JavaScript tooltip que trata de um script para tooltip utilizando o prototype, vale a pena conferir. [...]

By: Courtney Ringer

Courtney Ringer — Thu, 26 Oct 2006 20:06:52 +0000

I’ve experienced performance issues with sweet titles. I like the fact that it’s object oriented but it loops through all the title tags on whatever elements are defined and had caused my application to slow down. I also tried applying it to IMG tags and I got an error.

By: Stanislav Yakubenko

Stanislav Yakubenko — Wed, 25 Oct 2006 04:38:42 +0000

Why there are not working examples on the site?

By: Mark Birbeck

Mark Birbeck — Mon, 23 Oct 2006 10:19:39 +0000

But the point that is constantly missed in these discussions, is that you've lost all the semantics by using primarily script-based solutions. Anyone can put together some script that takes one DIV and overlays it onto another, but what does this DIV mean? How would a voice system understand it, for example? Romain's solution gets much closer to the ideal, since he uses a class of 'help' as the hook for the functionality. You might be interested to look at Declarative, Accessible Ajax with the HTML role attribute and Is it AJAX, Ajax...or XForms? for more on using mark-up to define behaviour at the same time as preserving semantics. Regards, Mark Mark Birbeck CEO formsPlayer.com

By: Dustin Diaz

Dustin Diaz — Sat, 21 Oct 2006 18:23:57 +0000

"too complicated and bloated, ... So I decided to create my own library that is based on prototype.js"

Something is inherently wrong with that thought, especially with something like Sweet Titles that has no library dependencies and it's short and easy to set up. However as far as flexibility goes, I've also set up a YUI Version of sweet titles that allows you to have multiple instances of a tooltip (kind of like this Prototype version) but allows you to adjust the time, opacity, and delay :)

var o = new YAHOO.widget.SweetTitles(
    elements,
    {
        time : 2,
        opacity : 0.8,
        delay : 0.5
    }
);  
o.init();

I will hand it to Jonathan, this eventually had to be done for Prototype. It's a necessary evil for every library.

By: Prototype based JavaScript tooltip at There was Code; Then there was AJAX!

Prototype based JavaScript tooltip at There was Code; Then there was AJAX! — Sat, 21 Oct 2006 17:53:33 +0000

[...] JavaScript Tooltip libraries number about as many as rounded CSS corner libraries. But we all know when you pull out the .js collection and start playing some interesting stuff can happen.read more | digg story Share and Enjoy:These icons link to social bookmarking sites where readers can share and discover new web pages. [...]

By: Ruby on Rails Blog

Ruby on Rails Blog — Sat, 21 Oct 2006 10:54:34 +0000

It worked on IE7 for me without any major hiccups. You can even do some fancy form within a form magic with some css manipulation. Nice and easy to implement. Now for a good ruby on rails helper renders a partial _help_page.rhtml inside the tooltip.

By: Bertrand Gorge

Bertrand Gorge — Sat, 21 Oct 2006 10:26:26 +0000

wz_tooltip works better imho. Been using it for years, and had no problem. This new tooltip.js is looking fine but it just doesn't seem very relyable (did a 5 minutes test, got all sort of problems, trashed).

By: romain garÃ§on

romain garÃ§on — Sat, 21 Oct 2006 10:16:44 +0000

oops a mistake…
a.help:hover span { display:block!important; display:inline-block;
sorry.

By: romain garÃ§on

romain garÃ§on — Sat, 21 Oct 2006 10:14:35 +0000

Without prototype is more safe…
[?] my tooltip


a.help {

position: relative;

text-decoration: none;

color: black;

border-bottom: 2px #eee dotted;

}

a.help span {

display: none;

}

a.help:hover {

background: none; /* IE hack */

z-index: 100;

}

a.help:hover span {

display: inline!important;

display:block;

max-width:200px;

position: absolute;

top: -1em;

left: -1em;

background: #ffffcc;

text-align: center;

color:#000;

padding:0 2px;

cursor:help; /* the cherry ;-) */

}

By: ajaxianfading

ajaxianfading — Sat, 21 Oct 2006 03:37:41 +0000

Here, here, My Mind Is Blown!
Why can’t anyone else see this! Why use prototype for this!!!???
Answers on a postcard please.

By: Thomas Messier

Thomas Messier — Sat, 21 Oct 2006 03:09:20 +0000

I use a slightly modified version of Dustin Diaz's Sweet Titles. I prefer not having to use script tags after to execute stuff.

By: My Mind is Blown

My Mind is Blown — Sat, 21 Oct 2006 01:02:11 +0000

I don’t understand how such a simple tooltip needs anything more than five lines of javascript. Seriously, people, learn how to code and stop relying on bloated libraries like this. You have a hidden div, you position that div to your cursor, you display that div. If you want to display dynamic content, use the prototype.lite library. I could understand if it was a particularly beautiful tooltip, but I can’t stand watching people build bridges to cross puddles.