It seems so hard to find a easy to use tooltip for Prototype library. The ones that are out there are so bloated.
What I am looking for is something as simple as this.
<a class="tooltip">This is my sentence<span>Tooltip is here</span> that ends in sorrow.</a> <a class="tooltip">How can I make this happen <span>like how?</span> without killing people.</a>
I have a CSS solution but the problem is once the tooltip is near edge of browser, it goes off the edge. I like it to be smart and not go off the edge of browser window.
Anyways? I was thinking of using Prototype to find the x-y coordinates of pop-up and move it. but how to do it?
This is what I am using for CSS
.date_info a:hover {background:#ffffff; text-decoration:none;} /*BG color is a must for IE6*/
.date_info a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:200px;}
.date_info a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #555; color:#6c6c6c;}