issue 43
(Patch: disable tooltip on mouse, at place tooltip at bottom ...) commented on by vantagewebstudios
- Change this.xCord = this.el.cumulativeOff... & this.yCord = this.el.cumulativeOff... to:
this.xCord =
this.el.cumulativeOffset()['left']-this.el.cumulativeScrollOffset()['left']+document.viewport.getScrollOffsets()['left']+5;
this.yCord =
this.el.cumulativeOffset()['top']-this.el.cumulativeScrollOffset()['top']+document.viewport.getScrollOffsets()['top']+this.el.getHeight()-20;
It will fix anything to do with scroll bars. Including the document scroll bar + any
parent scroll bars created using overflow:auto/scroll
Kind regards,
Scott
Change this.xCord = this.el.cumulativeOff... & this.yCord = this.el.cumulativeOff... to:
this.xCord =
this.el.cumulativeOffset()['left']-this.el.cumulativeScrollOffset()['left']+document.viewport.getScrollOffsets()['left']+5;
this.yCord =
this.el.cumulativeOffset()['top']-this.el.cumulativeScrollOffset()['top']+document.viewport.getScrollOffsets()['top']+this.el.getHeight()-20;
It will fix anything to do with scroll bars. Including the document scroll bar + any
parent scroll bars created using overflow:auto/scroll
Kind regards,
Scott
Oct 20, 2009
issue 43
(Patch: disable tooltip on mouse, at place tooltip at bottom ...) reported by vantagewebstudios
- I wanted tooltips on input boxes, but the damn tooltips kept getting in the
way of typing. So i added an option to allow the ability to have the
tooltip appear at the mouse, or in the bottom left of the element with the
tooltip on.
ADD TO DEFAULT OPTIONS:
showAtMousePointer: true // If true, the tooltip appears at the position
of the mouse pointer, else the bottom left of the element if false.
REPLACE SHOW() METHOD WITH:
show: function(e) {
if (this.options.showAtMousePointer) {
this.xCord = Event.pointerX(e);
this.yCord = Event.pointerY(e);
} else {
this.xCord = this.el.cumulativeOffset()['left']+5;
this.yCord = this.el.cumulativeOffset()['top']+this.el.getHeight()-20;
}
if(!this.initialized)
this.timeout = window.setTimeout(this.appear.bind(this),
this.options.delay);
},
REPLACE THE UPDATE() METHOD WITH:
update: function(e){
if (this.options.showAtMousePointer) {
this.xCord = Event.pointerX(e);
this.yCord = Event.pointerY(e);
} else {
this.xCord = this.el.cumulativeOffset()['left']+5;
this.yCord = this.el.cumulativeOffset()['top']+this.el.getHeight()-20;
}
this.setup();
},
Kind regards,
Scott http://www.coderprofile.com/coder/VBAssassin
I wanted tooltips on input boxes, but the damn tooltips kept getting in the
way of typing. So i added an option to allow the ability to have the
tooltip appear at the mouse, or in the bottom left of the element with the
tooltip on.
ADD TO DEFAULT OPTIONS:
showAtMousePointer: true // If true, the tooltip appears at the position
of the mouse pointer, else the bottom left of the element if false.
REPLACE SHOW() METHOD WITH:
show: function(e) {
if (this.options.showAtMousePointer) {
this.xCord = Event.pointerX(e);
this.yCord = Event.pointerY(e);
} else {
this.xCord = this.el.cumulativeOffset()['left']+5;
this.yCord = this.el.cumulativeOffset()['top']+this.el.getHeight()-20;
}
if(!this.initialized)
this.timeout = window.setTimeout(this.appear.bind(this),
this.options.delay);
},
REPLACE THE UPDATE() METHOD WITH:
update: function(e){
if (this.options.showAtMousePointer) {
this.xCord = Event.pointerX(e);
this.yCord = Event.pointerY(e);
} else {
this.xCord = this.el.cumulativeOffset()['left']+5;
this.yCord = this.el.cumulativeOffset()['top']+this.el.getHeight()-20;
}
this.setup();
},
Kind regards,
Scott http://www.coderprofile.com/coder/VBAssassin
Oct 20, 2009
issue 42
(Code Patch (fixes title= on image tags)) reported by vantagewebstudios
- What steps will reproduce the problem?
1. Add a title to several input tags.
What is the expected output?
To see a tooltip on each input box when you move the mouse over each input
box containing a title attribute.
What do you see instead?
A tooltip is produced only on the first input tag found, and the browsers
tooltip is shown on all the others.
What version of the product are you using? On what operating system?
Don't know, can't find a version number... i downloaded the .js file with
the last modified date of: March 11, 2009
THE PATCH,
Replace:
// If descendant elements has 'alt' attribute defined, clear it
this.el.descendants().each(function(el){
if(Element.readAttribute(el, 'alt'))
el.alt = "";
});
With:
// If descendant elements has 'alt' attribute defined, clear it
Try.these(function () {
this.el.descendants().each(function(el){
if(el.readAttribute('alt'))
el.alt = "";
});
}.bind(this));
What steps will reproduce the problem?
1. Add a title to several input tags.
What is the expected output?
To see a tooltip on each input box when you move the mouse over each input
box containing a title attribute.
What do you see instead?
A tooltip is produced only on the first input tag found, and the browsers
tooltip is shown on all the others.
What version of the product are you using? On what operating system?
Don't know, can't find a version number... i downloaded the .js file with
the last modified date of: March 11, 2009
THE PATCH,
Replace:
// If descendant elements has 'alt' attribute defined, clear it
this.el.descendants().each(function(el){
if(Element.readAttribute(el, 'alt'))
el.alt = "";
});
With:
// If descendant elements has 'alt' attribute defined, clear it
Try.these(function () {
this.el.descendants().each(function(el){
if(el.readAttribute('alt'))
el.alt = "";
});
}.bind(this));
Oct 14, 2009
issue 41
(hide function, parentNode is null) commented on by sensi2.fr
- ok my fix is crappy, the tooltips aren't deleted anymore
ok my fix is crappy, the tooltips aren't deleted anymore
Oct 14, 2009
issue 41
(hide function, parentNode is null) reported by antoineml
- What steps will reproduce the problem?
1. quickly move from on tooltip to another
The expected output is fine but the error console trigger a 'parentNode is
null' error
to fix that within the hide function (line ~64)
Replace :
new Effect.Fade(this.tooltip, {duration: this.options.hideDuration,
afterFinish: function() { Element.remove(this.tooltip) }.bind(this) });
With :
new Effect.Fade(this.tooltip, {duration: this.options.hideDuration,
afterFinish: function() { if((Element != null) && (Element.parentNode !=
null)){ Element.remove(this.tooltip) } }.bind(this) });
Regards
p.s.: btw sorry for posting -unexpectedly- several time this issue.
What steps will reproduce the problem?
1. quickly move from on tooltip to another
The expected output is fine but the error console trigger a 'parentNode is
null' error
to fix that within the hide function (line ~64)
Replace :
new Effect.Fade(this.tooltip, {duration: this.options.hideDuration,
afterFinish: function() { Element.remove(this.tooltip) }.bind(this) });
With :
new Effect.Fade(this.tooltip, {duration: this.options.hideDuration,
afterFinish: function() { if((Element != null) && (Element.parentNode !=
null)){ Element.remove(this.tooltip) } }.bind(this) });
Regards
p.s.: btw sorry for posting -unexpectedly- several time this issue.
Oct 14, 2009
issue 40
(function hide, element.parentNode is null) reported by antoineml
- What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
Please provide any additional information below.
What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
Please provide any additional information below.
Oct 14, 2009
issue 39
(function, element.parentNode is null) reported by antoineml
- What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
Please provide any additional information below.
What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
Please provide any additional information below.
Oct 01, 2009
issue 38
(Using Internet Explorer 8 results in JS Error) reported by jend...@pilzspore.de
- What steps will reproduce the problem?
1. using IE 8
What is the expected output? What do you see instead?
Javascript Error:
this.tooltip.down('.xarrow') => null
What version of the product are you using? On what operating system?
http://github.com/okonet/cooltips/commit/bd5ccc18ec804e99dff7be154c5ba0e97ae32762
Please provide any additional information below.
What steps will reproduce the problem?
1. using IE 8
What is the expected output? What do you see instead?
Javascript Error:
this.tooltip.down('.xarrow') => null
What version of the product are you using? On what operating system?
http://github.com/okonet/cooltips/commit/bd5ccc18ec804e99dff7be154c5ba0e97ae32762
Please provide any additional information below.
Jul 27, 2009
issue 37
(timeout) reported by rotalumis
- Am I missing something, or shouldn't the tooltip eventually fade out? It
seems to persist until you move away from the element. It seems like this
should be configurable, but I didn't see it.
Am I missing something, or shouldn't the tooltip eventually fade out? It
seems to persist until you move away from the element. It seems like this
should be configurable, but I didn't see it.
Jul 27, 2009
issue 36
(timeout) reported by rotalumis
- What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
Please provide any additional information below.
What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
Please provide any additional information below.
Jul 10, 2009
issue 35
(Download Link Broken) reported by rattlesn...@hotmail.com
- What steps will reproduce the problem?
1. Access http://okonet.ru/projects/tooltips/
2. Click on the download link
3. 404 not found
What is the expected output? What do you see instead?
A file being downloaded. 404 not found
What version of the product are you using? On what operating system?
No one, 'cause the link is broken
Please provide any additional information below.
Please, fix it!
What steps will reproduce the problem?
1. Access http://okonet.ru/projects/tooltips/
2. Click on the download link
3. 404 not found
What is the expected output? What do you see instead?
A file being downloaded. 404 not found
What version of the product are you using? On what operating system?
No one, 'cause the link is broken
Please provide any additional information below.
Please, fix it!
Jun 23, 2009
issue 34
(Initialize tooltips after ajax update to page???) commented on by pSauerbeck
- I ended up using:
$$(".tt").each( function(link) {new Tooltip(link)});
I ended up using:
$$(".tt").each( function(link) {new Tooltip(link)});
Jun 20, 2009
issue 34
(Initialize tooltips after ajax update to page???) reported by pSauerbeck
- What steps will reproduce the scenario?
1. get tooltips working correctly
2. add content via ajax
3. get tooltips to work for new content
So I am using Ruby/Rails, which probably doesn't matter in this case, but I need to re-initialize
the tooltip js from the controller after new content has been added to the page. Anyone know
how to handle this?
When I use lightbox, the call is Lightbox.prototype.updateImageList();
Certainly there must be something similar, but I don't know enough javascript to figure it out.
Any help is greatly appreciated.
Thanks,
Phillip
What steps will reproduce the scenario?
1. get tooltips working correctly
2. add content via ajax
3. get tooltips to work for new content
So I am using Ruby/Rails, which probably doesn't matter in this case, but I need to re-initialize
the tooltip js from the controller after new content has been added to the page. Anyone know
how to handle this?
When I use lightbox, the call is Lightbox.prototype.updateImageList();
Certainly there must be something similar, but I don't know enough javascript to figure it out.
Any help is greatly appreciated.
Thanks,
Phillip
Jun 04, 2009
issue 26
(Line break example not working) commented on by chakir93
- Hi, (sorry my en english is always --)
I adopted this solution to display HTML formatting in the title property in the tooltip :
In 'appear' method (Building tooltip container)
replace : [this.content]
with : [new Element("span").update(this.content)]
--> Builder.node interpret this.content as text (wating text or HTML element parameter)
Tested with :
Tooltip v1.0.
Prototype v1.6.0.2
script.aculo.us builder.js v1.7.0
Firefox 3.0 / IE7 / IE6 (windows)
Work perfectly with this example (the <br /> tag produces a newline) :
<div id="carousel_preview_list">
<img src="images/my.jpg" class="imageweb" alt ="my.jpg" title="<strong>Comments
:</strong><br />The first image" />
...
</div>
<script type="text/javascript" language="javascript">
$$('#carousel_preview_list .imageweb').each(function(preview_img)
{
new Tooltip(preview_img, {mouseFollow: true,
backgroundColor: '#FFF8DD',
borderColor: '#E9750C',
maxWidth: 350,
opacity: 0.85
});
});
</script>
Thanks for all
e.c
Hi, (sorry my en english is always --)
I adopted this solution to display HTML formatting in the title property in the tooltip :
In 'appear' method (Building tooltip container)
replace : [this.content]
with : [new Element("span").update(this.content)]
--> Builder.node interpret this.content as text (wating text or HTML element parameter)
Tested with :
Tooltip v1.0.
Prototype v1.6.0.2
script.aculo.us builder.js v1.7.0
Firefox 3.0 / IE7 / IE6 (windows)
Work perfectly with this example (the <br /> tag produces a newline) :
<div id="carousel_preview_list">
<img src="images/my.jpg" class="imageweb" alt ="my.jpg" title="<strong>Comments
:</strong><br />The first image" />
...
</div>
<script type="text/javascript" language="javascript">
$$('#carousel_preview_list .imageweb').each(function(preview_img)
{
new Tooltip(preview_img, {mouseFollow: true,
backgroundColor: '#FFF8DD',
borderColor: '#E9750C',
maxWidth: 350,
opacity: 0.85
});
});
</script>
Thanks for all
e.c
Jun 04, 2009
issue 26
(Line break example not working) commented on by chakir93
- Hi, (sorry my en english is always --)
I adopted this solution to display HTML formatting in the title property in the tooltip :
In 'appear' method (Building tooltip container)
replace : [this.content]
with : [new Element("span").update(this.content)]
--> Builder.node interpret this.content as text (wating text or HTML element parameter)
Tested with :
Tooltip v1.0.
Prototype v1.6.0.2
script.aculo.us builder.js v1.7.0
Firefox 3.0 / IE7 / IE6 (windows)
Work perfectly with this example :
<div id="carousel_preview_list">
<img src="images/my.jpg" class="imageweb" alt ="my.jpg" title="<strong>Comments
:</strong><br />The first image" />
...
</div>
<script type="text/javascript" language="javascript">
$$('#carousel_preview_list .imageweb').each(function(preview_img)
{
new Tooltip(preview_img, {mouseFollow: true,
backgroundColor: '#FFF8DD',
borderColor: '#E9750C',
maxWidth: 350,
opacity: 0.85
});
});
</script>
Thanks for all
e.c
Hi, (sorry my en english is always --)
I adopted this solution to display HTML formatting in the title property in the tooltip :
In 'appear' method (Building tooltip container)
replace : [this.content]
with : [new Element("span").update(this.content)]
--> Builder.node interpret this.content as text (wating text or HTML element parameter)
Tested with :
Tooltip v1.0.
Prototype v1.6.0.2
script.aculo.us builder.js v1.7.0
Firefox 3.0 / IE7 / IE6 (windows)
Work perfectly with this example :
<div id="carousel_preview_list">
<img src="images/my.jpg" class="imageweb" alt ="my.jpg" title="<strong>Comments
:</strong><br />The first image" />
...
</div>
<script type="text/javascript" language="javascript">
$$('#carousel_preview_list .imageweb').each(function(preview_img)
{
new Tooltip(preview_img, {mouseFollow: true,
backgroundColor: '#FFF8DD',
borderColor: '#E9750C',
maxWidth: 350,
opacity: 0.85
});
});
</script>
Thanks for all
e.c
Jun 03, 2009
issue 26
(Line break example not working) commented on by chakir93
- Hello, (sorry my en english is --)
Thanks for CoolTips !
I try also to display the break line into the tooltips with image elements.
I use version 1.0.
Prototype 1.6.0.2
Firefox 3.0 / IE7 / IE6 (windows)
Tried the solutions :





\n (with PHP)
chr(10) . chr(13)(with PHP)
The code is (as in the examples, with or without charset) :
<div id="carousel_preview_list">
<img src="images/my.jpg" class="imageweb" title="Comments :
The first image" />
...
</div>
<script type="text/javascript" charset="utf-8">
$$('#carousel_preview_list .imageweb').each(function(preview_img)
{
new Tooltip(preview_img, {mouseFollow: true,
backgroundColor: '#FFF8DD',
borderColor: '#E9750C',
maxWidth: 350,
opacity: 0.85
});
});
</script>
Thanks for your help.
c.e
Hello, (sorry my en english is --)
Thanks for CoolTips !
I try also to display the break line into the tooltips with image elements.
I use version 1.0.
Prototype 1.6.0.2
Firefox 3.0 / IE7 / IE6 (windows)
Tried the solutions :





\n (with PHP)
chr(10) . chr(13)(with PHP)
The code is (as in the examples, with or without charset) :
<div id="carousel_preview_list">
<img src="images/my.jpg" class="imageweb" title="Comments :
The first image" />
...
</div>
<script type="text/javascript" charset="utf-8">
$$('#carousel_preview_list .imageweb').each(function(preview_img)
{
new Tooltip(preview_img, {mouseFollow: true,
backgroundColor: '#FFF8DD',
borderColor: '#E9750C',
maxWidth: 350,
opacity: 0.85
});
});
</script>
Thanks for your help.
c.e
Jun 03, 2009
issue 26
(Line break example not working) commented on by chakir93
- Hello, (sorry my en english is --)
Thanks for CoolTips !
I try also to display the break line into the tooltips with image elements.
I use version 1.0.
Prototype 1.6.0.2
Firefox 3.0 / IE7 / IE6 (windows)
Tried the solutions :





\n (with PHP)
chr(10) . chr(13)(with PHP)
The code is (as in the examples, with or without charset) :
<script type="text/javascript" charset="utf-8">
$$('#carousel_preview_list .imageweb').each(function(preview_img)
{
new Tooltip(preview_img, {mouseFollow: true,
backgroundColor: '#FFF8DD',
borderColor: '#E9750C',
maxWidth: 350,
opacity: .85
});
});
</script>
Thanks for your help.
c.e
Hello, (sorry my en english is --)
Thanks for CoolTips !
I try also to display the break line into the tooltips with image elements.
I use version 1.0.
Prototype 1.6.0.2
Firefox 3.0 / IE7 / IE6 (windows)
Tried the solutions :





\n (with PHP)
chr(10) . chr(13)(with PHP)
The code is (as in the examples, with or without charset) :
<script type="text/javascript" charset="utf-8">
$$('#carousel_preview_list .imageweb').each(function(preview_img)
{
new Tooltip(preview_img, {mouseFollow: true,
backgroundColor: '#FFF8DD',
borderColor: '#E9750C',
maxWidth: 350,
opacity: .85
});
});
</script>
Thanks for your help.
c.e
Jun 01, 2009
issue 17
(Trying to set it up.) commented on by r.haudenschilt
- I'm having the same issue
I'm having the same issue
May 13, 2009
issue 26
(Line break example not working) commented on by i...@visualsense.nl
- Tried several ways my self:



\n
<br />
Nothing seems to work, neither does the example.
Any idea if this will be fixed or what the solultion is?
Tried several ways my self:



\n
<br />
Nothing seems to work, neither does the example.
Any idea if this will be fixed or what the solultion is?
May 04, 2009
issue 33
(Cooltip box appears in slightly different positions when rep...) reported by chris_el...@hotmail.com
- What steps will reproduce the problem?
1. Hovering over examples on cooltips page.
What is the expected output? What do you see instead?
Consistant size and position of tooltip. Differing placement and size of
tooltop. Min-width and height do not work in IE6.
What version of the product are you using? On what operating system?
Whatever is being used on the cooltip page. XP, FF3.0.3 and IE6.
Please provide any additional information below.
The tooltip box appears in slightly different positions when you hover on
then off then on again. Repeat several times and the tooltip box and it's
text start to appear under the cursor itself. Is there not an absolute
positioning on the tooltip box? Why does it move around like that? Please
advise. Thanks.
What steps will reproduce the problem?
1. Hovering over examples on cooltips page.
What is the expected output? What do you see instead?
Consistant size and position of tooltip. Differing placement and size of
tooltop. Min-width and height do not work in IE6.
What version of the product are you using? On what operating system?
Whatever is being used on the cooltip page. XP, FF3.0.3 and IE6.
Please provide any additional information below.
The tooltip box appears in slightly different positions when you hover on
then off then on again. Repeat several times and the tooltip box and it's
text start to appear under the cursor itself. Is there not an absolute
positioning on the tooltip box? Why does it move around like that? Please
advise. Thanks.
May 04, 2009
issue 3
(Cooltips usage) commented on by Preddy2006
- 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
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
Dec 04, 2008
issue 32
(Not quite unobtrusive) reported by brammeleman
- The fully unobtrusive claim on the home page is misleading. Especially if
you've used lightbox.js for example.
Either Cooltips should work similarly to Lightbox, requiring the use of a
certain class to activate it.
Or (but I like this option less) the "Installation and usage" section on
http://www.wildbit.com/labs/cooltips/ should have at least a point 4 and 5.
Point 4 explaining to use the title attribute, point 5 about how to
actually activate cooltips using a custom javascript snippet.
The fully unobtrusive claim on the home page is misleading. Especially if
you've used lightbox.js for example.
Either Cooltips should work similarly to Lightbox, requiring the use of a
certain class to activate it.
Or (but I like this option less) the "Installation and usage" section on
http://www.wildbit.com/labs/cooltips/ should have at least a point 4 and 5.
Point 4 explaining to use the title attribute, point 5 about how to
actually activate cooltips using a custom javascript snippet.
Dec 04, 2008
issue 23
(tool tips doesnt appear) commented on by brammeleman
- tooltips.js and scriptaculous.js could not be found on your server. Check it with
firebug!
tooltips.js and scriptaculous.js could not be found on your server. Check it with
firebug!
Nov 25, 2008
issue 31
(Tooltip only appears for first element) commented on by edheldur
- 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 = "";
});
}
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 = "";
});
}
Nov 10, 2008
issue 31
(Tooltip only appears for first element) reported by hillman.jeremy
- I want to display tooltips for several input elements in a form. Only the
first tooltip displays. This happens whether I call each element by id or
traverse the elements using:
$$("form input.tip").each( function(input) {
new Tooltip(input, {backgroundColor: "#FC9", borderColor: "#C96",
textColor: "#000", textShadowColor: "#FFF"});
});
I also get the following javascript error:
'this.el.descendants()' is null or not an object
I'm using Prototype 1.6.0.3 and Scriptaculous 1.8.1.
I want to display tooltips for several input elements in a form. Only the
first tooltip displays. This happens whether I call each element by id or
traverse the elements using:
$$("form input.tip").each( function(input) {
new Tooltip(input, {backgroundColor: "#FC9", borderColor: "#C96",
textColor: "#000", textShadowColor: "#FFF"});
});
I also get the following javascript error:
'this.el.descendants()' is null or not an object
I'm using Prototype 1.6.0.3 and Scriptaculous 1.8.1.
Nov 02, 2008
issue 30
(Not working on Opera Browser) reported by shiorap
- Hi. im just reporting that the css is not working on Opera browser
v9.52..
Hi. im just reporting that the css is not working on Opera browser
v9.52..
Oct 28, 2008
issue 29
(ON TTIP APPEARS IE7 MADE A SMALL SCROLL) commented on by desarrolloweb
- many thx iskatz!
thats my mistake :)
many thx iskatz!
thats my mistake :)
Oct 28, 2008
issue 29
(ON TTIP APPEARS IE7 MADE A SMALL SCROLL) commented on by lskatz
- $$("ul .ttt").each( function(image) {new
Tooltip(image{opacity:1,backgroundColor: "#DFEAFF",maxWidth:300});});
Is it because you are getting a javascript/prototype error due to the missing comma?
$$("ul .ttt").each( function(image) {new
Tooltip(image,{opacity:1,backgroundColor: "#DFEAFF",maxWidth:300});});
$$("ul .ttt").each( function(image) {new
Tooltip(image{opacity:1,backgroundColor: "#DFEAFF",maxWidth:300});});
Is it because you are getting a javascript/prototype error due to the missing comma?
$$("ul .ttt").each( function(image) {new
Tooltip(image,{opacity:1,backgroundColor: "#DFEAFF",maxWidth:300});});
Oct 13, 2008
issue 29
(ON TTIP APPEARS IE7 MADE A SMALL SCROLL) commented on by desarrolloweb
- sorry for the caps :S
sorry for the caps :S
Oct 13, 2008
issue 29
(ON TTIP APPEARS IE7 MADE A SMALL SCROLL) reported by desarrolloweb
- What steps will reproduce the problem?
1. attach title to a image
2. use CSS-query for CoolTips initialization:
$$("ul .ttt").each( function(image) {new
Tooltip(image{opacity:1,backgroundColor: "#DFEAFF",maxWidth:300});});
3. mouse over over the image class "ttt" under ul tags, and the page scroll
a bit
What is the expected output? What do you see instead?
The same behavoir of the demo :)
What version of the product are you using? On what operating system?
Tested over IE7 (7.0.6001.18000), WinVista
Please provide any additional information below.
I tested with prototype/scriptaculous 1.7.0 and with the version inside
http://tooltips.googlecode.com/files/tooltips1.0.zip
What steps will reproduce the problem?
1. attach title to a image
2. use CSS-query for CoolTips initialization:
$$("ul .ttt").each( function(image) {new
Tooltip(image{opacity:1,backgroundColor: "#DFEAFF",maxWidth:300});});
3. mouse over over the image class "ttt" under ul tags, and the page scroll
a bit
What is the expected output? What do you see instead?
The same behavoir of the demo :)
What version of the product are you using? On what operating system?
Tested over IE7 (7.0.6001.18000), WinVista
Please provide any additional information below.
I tested with prototype/scriptaculous 1.7.0 and with the version inside
http://tooltips.googlecode.com/files/tooltips1.0.zip
Oct 09, 2008
issue 8
(Tooltips "too" sticky) commented on by jberkhei
- This is an easy fix. Add the "click" event to hide the tooltip:
Event.observe(this.el, "mouseover", this.showEvent );
Event.observe(this.el, "mouseout", this.hideEvent );
Event.observe(this.el, "click", this.hideEvent );//new line to fix
issue
This is an easy fix. Add the "click" event to hide the tooltip:
Event.observe(this.el, "mouseover", this.showEvent );
Event.observe(this.el, "mouseout", this.hideEvent );
Event.observe(this.el, "click", this.hideEvent );//new line to fix
issue
Sep 27, 2008
issue 26
(Line break example not working) commented on by mittiprovence
- I could show some line breaks in an alert() popup after changing the line
this.content = this.el.title;
into the line
this.content = this.el.title.replace(/\\n/g, "\n");
alert(this.content); // Does show the line breaks in the alert() popup
But it still does not show the line breaks into the tooltips.
I could show some line breaks in an alert() popup after changing the line
this.content = this.el.title;
into the line
this.content = this.el.title.replace(/\\n/g, "\n");
alert(this.content); // Does show the line breaks in the alert() popup
But it still does not show the line breaks into the tooltips.
Sep 27, 2008
issue 28
(A parseInt to solve the wrongly triggered right alignment) reported by mittiprovence
- What steps will reproduce the problem?
1. Have a tool tip sitting on the very left of the page with a this.xCord
whose first digit is greater than the one of the page width.
2.
3.
What is the expected output? What do you see instead?
Expected align left but got align right. Consistent behavior.
What version of the product are you using? On what operating system?
1.0
Please provide any additional information below.
The problem is that the following test at line 106 uses strings instead of
integers.
// Tooltip doesn't fit the current document dimensions
if(this.xCord + this.options.width >= Element.getWidth(document.body)) {
A parseInt solves the problem.
if(parseInt(this.xCord) + parseInt(this.options.width) >=
Element.getWidth(document.body)) {
What steps will reproduce the problem?
1. Have a tool tip sitting on the very left of the page with a this.xCord
whose first digit is greater than the one of the page width.
2.
3.
What is the expected output? What do you see instead?
Expected align left but got align right. Consistent behavior.
What version of the product are you using? On what operating system?
1.0
Please provide any additional information below.
The problem is that the following test at line 106 uses strings instead of
integers.
// Tooltip doesn't fit the current document dimensions
if(this.xCord + this.options.width >= Element.getWidth(document.body)) {
A parseInt solves the problem.
if(parseInt(this.xCord) + parseInt(this.options.width) >=
Element.getWidth(document.body)) {
Sep 26, 2008
issue 27
(Font size) commented on by mittiprovence
- I had to edit the tooltip.css file to change the font size.
font-size: 14px;
I had to edit the tooltip.css file to change the font size.
font-size: 14px;
Sep 21, 2008
issue 27
(Font size) reported by mittiprovence
- What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
1.0
Please provide any additional information below.
I can't see how to change the font size.
What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
1.0
Please provide any additional information below.
I can't see how to change the font size.
Sep 20, 2008
issue 26
(Line break example not working) reported by mittiprovence
- What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
1.0
Please provide any additional information below.
The documentation does not show how to have a line break in the tooltips
content. The example given on the website gives an example of a line break
but it does not go to the next line.
What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
1.0
Please provide any additional information below.
The documentation does not show how to have a line break in the tooltips
content. The example given on the website gives an example of a line break
but it does not go to the next line.
Sep 20, 2008
issue 25
(Missing doc info) reported by mittiprovence
- What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
1.0
Please provide any additional information below.
It is not clear on your documentation that the initialisation must be done
AFTER the definition of the tooltips.
So this code
$$("span .tipPopup").each( function(link) {
new Tooltip(link, {mouseFollow: false});
});
MUST be sitting AFTER this one
<span><span class='tipPopup' title='$content'>$anchor</span></span>
It could also be put into a function called by the onLoad handler of the
body element like in
<script type="text/javascript">
function createTooltips() {
$$("span .tipPopup").each( function(link) {
new Tooltip(link, {mouseFollow: false});
});
}
</script>
<body onLoad="createTooltips();">
And finally it is not clear that there needs to be an enclosing element.
For example this does not work:
<span class='tipPopup' title='$content'>$anchor</span>
But this does:
<span><span class='tipPopup' title='$content'>$anchor</span></span>
These two points would help a great deal if they were clearly specified in
your doc on your website.
Cheers!
What steps will reproduce the problem?
1.
2.
3.
What is the expected output? What do you see instead?
What version of the product are you using? On what operating system?
1.0
Please provide any additional information below.
It is not clear on your documentation that the initialisation must be done
AFTER the definition of the tooltips.
So this code
$$("span .tipPopup").each( function(link) {
new Tooltip(link, {mouseFollow: false});
});
MUST be sitting AFTER this one
<span><span class='tipPopup' title='$content'>$anchor</span></span>
It could also be put into a function called by the onLoad handler of the
body element like in
<script type="text/javascript">
function createTooltips() {
$$("span .tipPopup").each( function(link) {
new Tooltip(link, {mouseFollow: false});
});
}
</script>
<body onLoad="createTooltips();">
And finally it is not clear that there needs to be an enclosing element.
For example this does not work:
<span class='tipPopup' title='$content'>$anchor</span>
But this does:
<span><span class='tipPopup' title='$content'>$anchor</span></span>
These two points would help a great deal if they were clearly specified in
your doc on your website.
Cheers!
