Cooltips usage

[GoogleCodeExporter]

> "Use any CSS-query for CoolTips initialization. For instance:"

This is where you lose me. You need to initialize it? by placing the code 
where? Thanks for your time.

Original issue reported on code.google.com by tem...@gmail.com on 1 Sep 2007 at 7:04

[GoogleCodeExporter]

once you set the class and id of your tooltip you need to tell javascript to 
activate it.

<script>
new Tooltip('myTarget', {mouseFollow: false});">
</script>

this goes after myTarget in the html.

Original comment by skateasy...@gmail.com on 12 Oct 2007 at 12:31

[GoogleCodeExporter]

I dont get how to use it either?

Here is my code:

<a href="#" title="Here is my tooltip" class="tip" id="tip">ToolTip Here</a>
<script type="text/javascript">
    $$("tip .tip").each( function(link) {
        new Tooltip(link, {});
    });
</script>

Original comment by justink...@gmail.com on 28 Oct 2007 at 2:19

[GoogleCodeExporter]

You mean to tell me I have to add a script after each and every title? 

Don't you respond to these comments anymore? This guy asked for help back in 
October!

Ummm... doesn't requiring scripts in the HTML nullify your "fully unobtrusive" 
claim 
on your home page? 

Disappointing... :?(

Original comment by chris_el...@hotmail.com on 7 Apr 2008 at 9:18

[GoogleCodeExporter]

No, you won't have to add a script after each title!

<script type="text/javascript">
    $$("p.tip").each( function(link) {
        new Tooltip(link, {});
    });
</script>

With this script, the tooltip is added to all HTML elements of type <p>, which 
have 
a class attribute of value "tip".

Original comment by m...@benjamin-rack.de on 23 Apr 2008 at 7:29

[GoogleCodeExporter]

Since I have been using this tooltip and didnt want to add the code in every 
new html
page, I suggest you do the following:

Add this to the tooltips.js file:

Note: formattooltips is the name of your function
      and dom:loaded ensures that the tooltips are correctly displayed

Event.observe(window, 'dom:loaded', formattooltips, false);

function formattooltips() {
$$("ul .help").each( function(link) {
    new Tooltip(link, {mouseFollow: false});
});
$$("p .help").each( function(input) {
    new Tooltip(input, {backgroundColor: "#333", borderColor: "#333", 
    textColor: "#FFF", textShadowColor: "#000"});
});
$$("form input.help").each( function(input) {
    new Tooltip(input, {backgroundColor: "#FC9", borderColor: "#C96", 
    textColor: "#000", textShadowColor: "#FFF"});
});

}

I also had to apply fix 31 from edheldur because only one tooltip had been 
display in
my form.

Here's his fix (Apply to tooltips.js [Starts around line 20]):

I've used the following as a workaround:

Change the following lines:
this.el.descendants().each(function(el){
    if(Element.readAttribute(el, 'alt'))
        el.alt = "";
});

For:
if (this.el.descendants()!=null)
{
    this.el.descendants().each(function(el){
        if(Element.readAttribute(el, 'alt'))
            el.alt = "";
    });
}

This should fix the problem. Hope I could save you some time.

Greetings Matthias

Original comment by Preddy2...@googlemail.com on 4 May 2009 at 9:55