Html markup/tool tip appears on website

The html markup/tool tip boxes appear on our newly published
website Aardvarkartbazaar.com. They show- up when you hover over
the artwork on the Art For Sale section. Any suggestions on how to
remove these from appearing on our website would be much
appreciated.

I see that the title attributes contain stuff like:
title="
Artist: Mike Sweeney
<br>
<br>
$60 (S & H included)
<br>
<br>
you actually can´t have html tags within title or alt
attributes, that´s why it´s getting displayed "as is" --
use plain text only

Similar Messages

Spry Tool Tip Error

Hi there, I'm really interested in getting the SPRY tool tips
working. I have a page that uses them on all my images. The first
line of tool tips work. The second doesn't follow the mouse
completely and on the last line of images the tool tip appears half
way up the page. Anyone work out why?
The page is:
http://www.hforhome.co.uk/development/tool-tip-deleteme.html
Thanks in advanced for any help.
DWS
The
page in question

I've just noticed that the tool tip doesn't go lower than
lowest part of the initial browser height. Weird. This seems to be
a Firefox problem. I'm only able to test on Firefox3 and Safari.
Can anyone let me know it works in IE?
Thanks
DWS

How does one turn off the URL tool tip

When the cursor hovers over a web link a tool tip appears giving the links URL. How can this event be turned off, or better, turned on/off through the context menu?

And, uh, the list of hidden commands is available where exactly? This could lead to serious trouble/fun.
My list isn't available publicly; I got it from my contacts at Apple. There is a partial list of some of these hidden commands Secrets here, but you can easily damage your system if you don't know what you're doing. That means, unless you're prepared to recover from a completely non-functioning system, you shouldn't be playing with these commands. Apple does not support them in any way.
Mulder

Bridge CS6 tool tips are blocking the buttons!

When I try to change the layout view (grid, list, etc.) with the buttons on the bottom right, the tool tips appear and I'm not able to click through them. So, basically, when I hover over them, the tool tips are blocking me from doing it.
I look in Prefs for a Tool Tips checkbox and it's not checked right now, but they're still appearing, and still protecting the buttons from being clicked.
Anyone know how to turn them off?
And I have to say this is the most ridiculous problem I ever had with a program. Kinda funny.

I still don't think it's the right checkbox to deactivate interface tool tips as it's in the "Thumbnails" sections of prefs. (And when I switch that on I get tool tips for thumbnails, when I switch it off I do not get tool tips for thumbnails. But the interface tool tips are always consistent.)
Well, I'm again afraid. But this time for my big mouth...
You are very right, I did have a long delay on my machine before the tooltips showed and having the checkbox set to on it seemed directly appearing.
As there are many inconsistencies in Bridge (in fact throughout the whole Suite) this one is very big. Don't have a good alternative short name for it but calling 'show metadata when hovering over' 'show tooltips' is really a very bad approach
The version is CS6 and I'm on a 2009 Mac Pro using 10.6.8 if that matters any.
Thanks, it always matters, especially since this has become a general forum with both Windows and Mac. Different OS and different versions (including detail version number) gives more insight in possible solutions or advice (update etc)
Also, I noticed that if I make Bridge CS6 smaller than the monitor window, then the tool tips over the buttons do not appear over the buttons anymore, but under them instead. The tool tips seem to be set to appear below the mouse pointer. When Bridge is maximized and the bottom of the Bridge window touches the bottom of the monitor there is no place else for the tool tips to go, so they get pushed up... and cover the buttons.
I always have the Dock in sight hence pressing the green button to enlarge my Bridge window to full screen leaves a small free space and as you well discovered has not your problematic behavior with tooltips over buttons.
I would think Bridge should be able to detect the end of the screen, obviously it does because it knows to move the tool tips up so they don't appear "off screen".
They should use this detection to determine if the tool tips should appear above or below (or away from the screen edge) the mouse pointer.
Agreed
I'll stop calling it a bug and switch it to "oversight". Bottom line though is the tool tips still block the buttons and shield them from being clicked.
Oversight is the correct word, but besides the above described improvement they really should get rid of the name tooltips in thumbnails and add an option to really hide or show all tooltips as you would expect in a proper application
Thanks for staying tuned and clarify!
While the Bridge team tries to read most of this forum it might be wise to make a feature request for this, are you willing to do so since this is your discovery?

Pesky little tool tip in Premiere

That bug is SO ANNOYING. And it's been like that since at least CS4. I just cannot drop the clip I'm currently holding where that ugly tool tip appears. I'm too lazy to type all that useless stuff in here. So I made a video before anyone asks "blah blah, that's not a bug. It's a feature."
Yeah, sure! Anyways, here's the video link: http://www.youtube.com/watch?v=-Kq1ny_Vn-o

I have to admit that this 'bug' is obviously not a huge one and I don't want Adobe to invest too much time in it. But it still is pretty useless not beeing able to drop the clip when that box is there. And I think every 'problem' (even the minor ones) need to be said, so that the developer knows what to fix (or what to ignore).
All I could do was to send a ticket and start a thread in the forums. Now that bug is known and I can get back to work.

Tooltips (tool tips) do not show in Illustrator 14.0.0 (CS4)

Hello,
Today when I launch Illustrator CS4, I'm unable to see the tooltips that appear when the mouse hovers over the tools or any of the buttons on the panels. I'm still able to see the pop-up tooltips on the artboards (e.g., smart guide information).
I've double checked the preference option to ensure that "show tool tips" is checked.
I also deleted the preferences file (AIPrefs) in case it was corrupted.
None of this worked.
Does anyone know how to make the tool-tips appear again?
thanks in advance!
JP

Hi Scott,
Thanks for the reply. I'm farily certain that the mouse is not moving from any vibrations (heavy mouse, no detectible vibrations, etc.). If I leave my mouse over a tool and leave my hand off the mouse for a while, no tooltips.
... after rebooting my machine (Vista x64), the tooltips seem to have come back on. Like others have mentioned in these threads, it seems to take either about 4 seconds and/or mousing over several tools before the tooltips appear.... so I think this issue has resolved itself after the reboot.
thanks,
JP

Corrupt tool tips

There's something wrong with my tool tips - those little tips or labels that appear next to the mouse pointer when it pauses over a tool / icon.
Here's an example, from hovering the mouse over the icon to insert in the editor for editing a message here.
Sometimes it's mangled with the correct tool tip (like in the first example above), and sometimes the tool tip appears by itself (because there is no correct tool tip, like in the second example above - hovering over text shouldn't generate a tool tip). It's the same few out-of-place tool tips that appear and they all seem finance or stock quote related. Here's more:
Note: the mouse pointer doesn't get capturesd by screenshots but know that it's there right above the tool tip.
The other strange thing is that this only happens in part of the screen area - baseically center, top.
Any ideas? I've rebooted, but that's all I've tried so far.

This always happens! Right after I post, I figure it out: the list from Dashboard is bleeding through somehow:
So, having my mouse pointer in the same area of the screen where the widget would appear if I activated Dashboard causes the tool tips to appear as if actually was hovering over the widget! How strange. So, I deleted the widget and then put it back in the same spot. Seems OK now.

HTML tool tip on text fragment....how?

I need a tool tip on a piece of text using HTML. I thought below would work when pasted in the HTML snipped widget, but it does not work (everything is fine, just no tool time).
text fragment
What would work?
Thanks
bob

Bob ~ If your post doesn't look correct in Preview mode, it probably won't look correct when posted. For most HTML to display properly in these forums it has to be "escaped", using this free tool for example:
http://www.htmlescape.net/htmlescape_tool.html
...then your code fragment will look like this:
<span tooltip="This tool tip is attached to a <span> element that encloses the words "text fragment""> text fragment </span>
As far as solving the problem, I'm not sure, as this solution with URLs:
http://iwebfaq.org/site/iWeb_Tooltips.html
...may not be what you're looking for.

Alt-text 'tool tip' not appearing on some images

We get pdf files created by outside sources that we then need to publish on our webpage. I add tags to the pdf, then add the alt-text to the images via the Touch Up Text tool. As well as I can determine, the tag for the alt-text is present in the pdf. The Read Out Loud function in Acrobat reads the alt-text correctly as does a screen reader. But the 'tool tip' does not appear on all images. It seems that the more complex, mulitple layered dwg type images do not display the text, either from the browser, or from Acrobat itself. Other dwg source images do work, and photgraphic images are ok.
I have gone back through the pdfs to verify the existence of the figure tag, and that the alt-text is there.
I have opened the tags dialog, looked at the properties, and added the text to the Title field as well as the alt-text and Actual Text.
I have converted the images to jpgs, which resolves the issue, but greatly reduces the quality of the image.
I am using Acrobat Pro 8.1.4 on a Windows XP, sp2 system.
I am aware that the ADA requirement do not require the 'tool-tip' to function, but when you have many, many pages of images in a pdf using a screen reader or the read out loud function to test is not feasible for testing. We need to have the tool-tip working, and I have run out of ideas on how to make it work.

I just figured out that those photos had been set to a blending mode of Multiply
because an earlier iteration of the design used transparency. But to the eye, they
look like normal photos, so I didn't realize they were set to Multiply.
This solved the problem but it's not heartening news. What if my graphic legitimately
did have a blending mode set? What would my workaround be if I needed to set Alt Text
for those images?

Tool tip to not move

Hi I'm a big fan. long time lurker first time poster
Currently the position of the tool tip depends on where the cursor first hovers over the image. Is there a way for the tool tip to appear in the same place no mater where the image is hovered?
below is the js and css
thanks
// SpryTooltip.js - version 0.9 - Spry 1.6.1
(function() { // BeginSpryComponent
if (typeof Spry == "undefined") window.Spry = {}; if (!Spry.Widget) Spry.Widget = {};
Spry.Widget.BrowserSniff = function()
var b = navigator.appName.toString();
var up = navigator.platform.toString();
var ua = navigator.userAgent.toString();
this.mozilla = this.ie = this.opera = this.safari = false;
var re_opera = /Opera.([0-9\.]*)/i;
var re_msie = /MSIE.([0-9\.]*)/i;
var re_gecko = /gecko/i;
var re_safari = /(applewebkit|safari)\/([\d\.]*)/i;
var r = false;
if ( (r = ua.match(re_opera))) {
this.opera = true;
this.version = parseFloat(r[1]);
} else if ( (r = ua.match(re_msie))) {
this.ie = true;
this.version = parseFloat(r[1]);
} else if ( (r = ua.match(re_safari))) {
this.safari = true;
if(parseFloat(r[2]) < 420)
this.version = 2;
else
this.version = 3;
} else if (ua.match(re_gecko)) {
var re_gecko_version = /rv:\s*([0-9\.]+)/i;
r = ua.match(re_gecko_version);
this.mozilla = true;
this.version = parseFloat(r[1]);
this.windows = this.mac = this.linux = false;
this.Platform = ua.match(/windows/i) ? "windows" :
(ua.match(/linux/i) ? "linux" :
(ua.match(/mac/i) ? "mac" :
ua.match(/unix/i)? "unix" : "unknown"));
this[this.Platform] = true;
this.v = this.version;
if (this.safari && this.mac && this.mozilla) {
this.mozilla = false;
Spry.is = new Spry.Widget.BrowserSniff();
Spry.Widget.Tooltip = function(tooltip_element, trigger_selector, options)
options = Spry.Widget.Utils.firstValid(options, {});
this.init(trigger_selector, tooltip_element, options);
if (Spry.Widget.Tooltip.onloadDidFire)
this.attachBehaviors();
Spry.Widget.Tooltip.loadQueue.push(this);
Spry.Widget.Tooltip.prototype.init = function(trigger_element, tooltip_element, options)
var Utils = Spry.Widget.Utils;
this.triggerElements = Utils.getElementsByClassName(trigger_element);
this.tooltipElement = Utils.getElement(tooltip_element);
options.showDelay = parseInt(Utils.firstValid(options.showDelay, 0), 10);
options.hideDelay = parseInt(Utils.firstValid(options.hideDelay, 0), 10);
if (typeof this.triggerElements == 'undefined' || !(this.triggerElements.length > 0))
this.showError('The element(s) "' + trigger_element + '" do not exist in the page');
return false;
if (typeof this.tooltipElement == 'undefined' || !this.tooltipElement)
this.showError('The element "' + tooltip_element + '" do not exists in the page');
return false;
this.listenersAttached = false;
this.hoverClass = "";
this.followMouse = false;
this.offsetX = 15;
this.offsetY = 15;
this.closeOnTooltipLeave = false;
this.useEffect = false;
Utils.setOptions(this, options);
this.animator = null;
for (var i =0; i < this.triggerElements.length; i++)
if (!this.triggerElements[i].className)
this.triggerElements[i].className = '';
if (this.useEffect){
switch (this.useEffect.toString().toLowerCase()){
case 'blind': this.useEffect = 'Blind'; break;
case 'fade': this.useEffect = 'Fade'; break;
default:
this.useEffect = false;
this.visibleTooltip = false;
// Hack for FF 3 - Safari 3: force painting of the element, in order to have the correct display
this.tooltipElement.offsetHeight;
// Optimisation: save browser work if display is already 'none'
if (Spry.Widget.Utils.getStyleProperty(this.tooltipElement, 'display') != 'none')
this.tooltipElement.style.display = 'none';
if (typeof this.offsetX != 'numeric')
this.offsetX = parseInt(this.offsetX, 10);
if (isNaN(this.offsetX))
this.offsetX = 0;
if (typeof this.offsetY != 'numeric')
this.offsetY = parseInt(this.offsetY, 10);
if (isNaN(this.offsetY))
this.offsetY = 0;
this.tooltipElement.style.position = 'absolute';
this.tooltipElement.style.top = '0px';
this.tooltipElement.style.left = '0px';
Spry.Widget.Tooltip.onloadDidFire = false;
Spry.Widget.Tooltip.loadQueue = [];
Spry.Widget.Tooltip.addLoadListener = function(handler)
if (typeof window.addEventListener != 'undefined')
window.addEventListener('load', handler, false);
else if (typeof document.addEventListener != 'undefined')
document.addEventListener('load', handler, false);
else if (typeof window.attachEvent != 'undefined')
window.attachEvent('onload', handler);
Spry.Widget.Tooltip.processLoadQueue = function(handler)
Spry.Widget.Tooltip.onloadDidFire = true;
var q = Spry.Widget.Tooltip.loadQueue;
var qlen = q.length;
for (var i = 0; i < qlen; i++)
if (!q[i].listenersAttached)
q[i].attachBehaviors();
Spry.Widget.Tooltip.addLoadListener(Spry.Widget.Tooltip.processLoadQueue);
Spry.Widget.Tooltip.prototype.addClassName = function(ele, className)
if (!ele || !className)
return;
if (ele.className.indexOf(className) == -1)
ele.className += (ele.className ? " " : "") + className;
Spry.Widget.Tooltip.prototype.removeClassName = function(ele, className)
if (!ele || !className )
return;
ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
Spry.Widget.Tooltip.prototype.showTooltip = function()
if (!this.visibleTooltip)
this.tooltipElement.style.visibility = 'hidden';
this.tooltipElement.style.zIndex = '9999';
this.tooltipElement.style.display = 'block';
Spry.Widget.Utils.putElementAt(this.tooltipElement, this.pos, {x:this.offsetX, y:this.offsetY}, true);
if(Spry.is.ie && Spry.is.version == '6')
this.createIframeLayer(this.tooltipElement);
if (!this.visibleTooltip)
if (this.useEffect)
if (typeof this.showEffect == 'undefined')
this.showEffect = new Spry.Widget.Tooltip[this.useEffect](this.tooltipElement, {from: 0, to: 1});
this.showEffect.start();
else
this.tooltipElement.style.visibility = 'visible';
this.visibleTooltip = true;
Spry.Widget.Tooltip.prototype.hideTooltip = function(quick)
if (this.useEffect && !quick)
if (typeof this.hideEffect == 'undefined')
this.hideEffect = new Spry.Widget.Tooltip[this.useEffect](this.tooltipElement, {from: 1, to: 0});
this.hideEffect.start();
else
if (typeof this.showEffect != 'undefined')
this.showEffect.stop();
this.tooltipElement.style.display = 'none';
if(Spry.is.ie && Spry.is.version == '6')
this.removeIframeLayer(this.tooltipElement);
if (this.hoverClass && !this.hideTimer)
for (var i = 0; i < this.triggerElements.length; i++)
this.removeClassName(this.triggerElements[i], this.hoverClass);
this.visibleTooltip = false;
Spry.Widget.Tooltip.prototype.displayTooltip = function(show) {
if (this.tooltipElement)
if (this.hoverClass){
for (var i = 0; i < this.triggerElements.length; i++)
this.removeClassName(this.triggerElements[i], this.hoverClass);
if (show)
if (this.hideTimer)
clearInterval(this.hideTimer);
delete(this.hideTimer);
if (this.hoverClass)
if (typeof this.triggerHighlight != 'undefined')
this.addClassName(this.triggerHighlight, this.hoverClass);
var self = this;
this.showTimer = setTimeout(function(){self.showTooltip()}, this.showDelay);
else
if (this.showTimer)
clearInterval(this.showTimer);
delete(this.showTimer);
var self = this;
this.hideTimer = setTimeout(function(){self.hideTooltip();}, this.hideDelay);
this.refreshTimeout();
Spry.Widget.Tooltip.prototype.onMouseOverTrigger = function(e)
var target = '';
if (Spry.is.ie)
target = e.srcElement;
else
target = e.target;
var contains = Spry.Widget.Utils.contains;
for (var i = 0; i < this.triggerElements.length; i++)
if (contains(this.triggerElements[i], target))
target = this.triggerElements[i];
break;
if (i == this.triggerElements.length) return;
if (this.visibleTooltip && this.triggerHighlight && this.triggerHighlight == target)
if (this.hideTimer)
clearInterval(this.hideTimer);
delete(this.hideTimer);
if (this.hoverClass)
if (typeof this.triggerHighlight != 'undefined')
this.addClassName(this.triggerHighlight, this.hoverClass);
return;
var pos = Spry.Widget.Utils.getAbsoluteMousePosition(e);
this.pos = {x: pos.x + this.offsetX, y: pos.y + this.offsetY};
this.triggerHighlight = target;
Spry.Widget.Tooltip.closeAll();
this.displayTooltip(true);
Spry.Widget.Tooltip.prototype.onMouseMoveTrigger = function(e)
var pos = Spry.Widget.Utils.getAbsoluteMousePosition(e);
this.pos = {x: pos.x + this.offsetX, y: pos.y + this.offsetY};
if (this.visibleTooltip)
this.showTooltip();
Spry.Widget.Tooltip.prototype.onMouseOutTrigger = function(e)
var target = '';
if (Spry.is.ie)
target = e.toElement;
else
target = e.relatedTarget;
var contains = Spry.Widget.Utils.contains;
for (var i=0; i < this.triggerElements.length; i++)
if (contains(this.triggerElements[i], target))
return;
this.displayTooltip(false);
Spry.Widget.Tooltip.prototype.onMouseOutTooltip = function(e)
var target = '';
if (Spry.is.ie)
target = e.toElement;
else
target = e.relatedTarget;
var contains = Spry.Widget.Utils.contains;
if (contains(this.tooltipElement, target))
return;
this.displayTooltip(false);
Spry.Widget.Tooltip.prototype.onMouseOverTooltip = function(e)
if (this.hideTimer)
clearInterval(this.hideTimer);
delete(this.hideTimer);
if (this.hoverClass)
if (typeof this.triggerHighlight != 'undefined')
this.addClassName(this.triggerHighlight, this.hoverClass);
Spry.Widget.Tooltip.prototype.refreshTimeout = function()
if (Spry.Widget.Tooltip.refreshTimeout != null)
clearTimeout(Spry.Widget.Tooltip.refreshTimeout);
Spry.Widget.Tooltip.refreshTimeout = null;
Spry.Widget.Tooltip.refreshTimeout = setTimeout(Spry.Widget.Tooltip.refreshAll, 100);
Spry.Widget.Tooltip.prototype.destroy = function()
for (var k in this)
try{
if (typeof this.k == 'object' && typeof this.k.destroy == 'function') this.k.destroy();
delete this.k;
}catch(err){}
Spry.Widget.Tooltip.prototype.checkDestroyed = function()
// checks the parent node. If it exists, then the element is still in the DOM
if (!this.tooltipElement || this.tooltipElement.parentNode == null)
return true;
return false;
Spry.Widget.Tooltip.prototype.attachBehaviors = function()
var self = this;
var ev = Spry.Widget.Utils.addEventListener;
for (var i=0; i< this.triggerElements.length; i++)
ev(this.triggerElements[i], 'mouseover', function(e) {self.onMouseOverTrigger(e || event); return true;}, false);
ev(this.triggerElements[i], 'mouseout', function(e) {self.onMouseOutTrigger(e || event); return true;}, false);
if (this.followMouse)
ev(this.triggerElements[i], 'mousemove', function(e) {self.onMouseMoveTrigger(e || event); return true;}, false);
if (this.closeOnTooltipLeave)
ev(this.tooltipElement, 'mouseover', function(e){self.onMouseOverTooltip(e || event); return true;}, false);
ev(this.tooltipElement, 'mouseout', function(e){self.onMouseOutTooltip(e || event); return true;}, false);
this.listenersAttached = true;
// createIframeLayer for Tooltip
// creates an IFRAME underneath a tooltip element so that it will show above form controls and ActiveX
Spry.Widget.Tooltip.prototype.createIframeLayer = function(tooltip)
if (typeof this.iframeLayer == 'undefined')
var layer = document.createElement('iframe');
layer.tabIndex = '-1';
layer.src = 'javascript:"";';
layer.scrolling = 'no';
layer.frameBorder = '0';
layer.className = 'iframeTooltip';
tooltip.parentNode.appendChild(layer);
this.iframeLayer = layer;
this.iframeLayer.style.left = tooltip.offsetLeft + 'px';
this.iframeLayer.style.top = tooltip.offsetTop + 'px';
this.iframeLayer.style.width = tooltip.offsetWidth + 'px';
this.iframeLayer.style.height = tooltip.offsetHeight + 'px';
this.iframeLayer.style.display = 'block';
// removeIframeLayer for Tooltip Element
// removes an IFRAME underneath a tooltip to reveal any form controls and ActiveX
Spry.Widget.Tooltip.prototype.removeIframeLayer = function(tooltip)
if (this.iframeLayer)
this.iframeLayer.style.display = 'none';
Spry.Widget.Tooltip.prototype.showError = function(msg)
alert('Spry.Widget.Tooltip ERR: ' + msg);
Spry.Widget.Tooltip.refreshAll = function()
var q = Spry.Widget.Tooltip.loadQueue;
var qlen = q.length;
for (var i = 0; i < qlen ; i++)
if (q[i].checkDestroyed())
// the trigger element is no longer in the dom, we should remove the current widget.
q[i].destroy();
q.splice(i, 1);
i--;
qlen = q.length;
Spry.Widget.Tooltip.closeAll = function()
var q = Spry.Widget.Tooltip.loadQueue;
var qlen = q.length;
for (var i = 0; i < qlen ; i++)
if (q[i].visibleTooltip)
q[i].hideTooltip(true);
if (q[i].showTimer)
clearTimeout(q[i].showTimer);
if (q[i].hideTimer)
clearTimeout(q[i].hideTimer);
Spry.Widget.Tooltip.Animator = function(element, opts)
this.timer = null;
this.fps = 60;
this.duration = 500;
this.startTime = 0;
this.transition = Spry.Widget.Tooltip.Animator.defaultTransition;
this.onComplete = null;
if (typeof element == 'undefined') return;
this.element = Spry.Widget.Utils.getElement(element);
Spry.Widget.Utils.setOptions(this, opts, true);
this.interval = this.duration / this.fps;
Spry.Widget.Tooltip.Animator.defaultTransition = function(time, begin, finish, duration) { time /= duration; return begin + ((2 - time) * time * finish); };
Spry.Widget.Tooltip.Animator.prototype.start = function()
var self = this;
this.startTime = (new Date).getTime();
this.beforeStart();
this.timer = setInterval(function() { self.stepAnimation(); }, this.interval);
Spry.Widget.Tooltip.Animator.prototype.stop = function()
if (this.timer)
clearTimeout(this.timer);
this.timer = null;
Spry.Widget.Tooltip.Animator.prototype.stepAnimation = function(){};
Spry.Widget.Tooltip.Animator.prototype.beforeStart = function(){};
Spry.Widget.Tooltip.Animator.prototype.destroy = function()
for (var k in this)
try
delete this.k;
}catch(err){}
Spry.Widget.Tooltip.Fade = function(element, opts)
Spry.Widget.Tooltip.Animator.call(this, element, opts);
if (Spry.is.ie)
this.origOpacity = this.element.style.filter;
else
this.origOpacity = this.element.style.opacity;
Spry.Widget.Tooltip.Fade.prototype = new Spry.Widget.Tooltip.Animator();
Spry.Widget.Tooltip.Fade.prototype.constructor = Spry.Widget.Tooltip.Fade;
Spry.Widget.Tooltip.Fade.prototype.stepAnimation = function()
var curTime = (new Date).getTime();
var elapsedTime = curTime - this.startTime;
var i, obj;
if (elapsedTime >= this.duration)
this.beforeStop();
this.stop();
return;
var ht = this.transition(elapsedTime, this.from, this.to - this.from, this.duration);
if (Spry.is.ie)
var filter = this.element.style.filter.replace(/alpha\s*$\s*opacity\s*=\s*[0-9\.]{1,3}$/, '');
this.element.style.filter = filter + 'alpha(opacity=' + parseInt(ht * 100, 10) + ')';
else
this.element.style.opacity = ht;
this.element.style.visibility = 'visible';
this.element.style.display = 'block';
Spry.Widget.Tooltip.Fade.prototype.beforeStop = function()
if (this.from > this.to)
this.element.style.display = 'none';
if (Spry.is.mozilla)
this.element.style.filter = this.origOpacity;
else
this.element.style.opacity = this.origOpacity;
Spry.Widget.Tooltip.Blind = function(element, opts)
this.from = 0;
this.to = 100;
Spry.Widget.Tooltip.Animator.call(this, element, opts);
this.element.style.visibility = 'hidden';
this.element.style.display = 'block';
this.origHeight = parseInt(Spry.Widget.Utils.getStyleProperty(this.element, 'height'),10);
if (isNaN(this.origHeight))
this.origHeight = this.element.offsetHeight;
if (this.to == 0)
this.from = this.origHeight;
else
this.to = this.origHeight;
Spry.Widget.Tooltip.Blind.prototype = new Spry.Widget.Tooltip.Animator();
Spry.Widget.Tooltip.Blind.prototype.constructor = Spry.Widget.Tooltip.Blind;
Spry.Widget.Tooltip.Blind.prototype.beforeStart = function()
this.origOverflow = Spry.Widget.Utils.getStyleProperty(this.element, 'overflow');
this.element.style.overflow = 'hidden';
Spry.Widget.Tooltip.Blind.prototype.stepAnimation = function()
var curTime = (new Date).getTime();
var elapsedTime = curTime - this.startTime;
var i, obj;
if (elapsedTime >= this.duration)
this.beforeStop();
this.stop();
return;
var ht = this.transition(elapsedTime, this.from, this.to - this.from, this.duration);
this.element.style.height = Math.floor(ht) + 'px';
this.element.style.visibility = 'visible';
this.element.style.display = 'block';
Spry.Widget.Tooltip.Blind.prototype.beforeStop = function()
this.element.style.overflow = this.origOverflow;
if (this.from > this.to)
this.element.style.display = 'none';
this.element.style.height = this.origHeight + 'px';
// Spry.Widget.Utils
if (!Spry.Widget.Utils) Spry.Widget.Utils = {};
Spry.Widget.Utils.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
if (!optionsObj)
return;
for (var optionName in optionsObj)
if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
continue;
obj[optionName] = optionsObj[optionName];
Spry.Widget.Utils.getElement = function(ele)
if (ele && typeof ele == "string")
return document.getElementById(ele);
return ele;
Spry.Widget.Utils.getElementsByClassName = function(sel)
if (!sel.length > 0)
return null;
var selectors = sel.split(',');
var el = [];
for (var i =0; i < selectors.length; i++)
var cs = selectors[i];
var chunk = cs.split(' ');
var parents = [];
parents[0] = [];
parents[0][0] = document.body;
for (var j = 0; j < chunk.length; j++)
var tokens = Spry.Widget.Utils.getSelectorTokens(chunk[j]);
for (var k =0; k < parents[j].length; k++)
var childs = parents[j][k].getElementsByTagName('*');
parents[j+1] = [];
for (var l=0; l < childs.length; l++)
if (Spry.Widget.Utils.hasSelector(childs[l], tokens))
parents[j+1].push(childs[l]);
if (parents[j])
for (var k = 0; k < parents[j].length; k++)
el.push(parents[j][k]);
return el;
Spry.Widget.Utils.firstValid = function()
var ret = null;
var a = Spry.Widget.Utils.firstValid;
for(var i=0; i< a.arguments.length; i++)
if (typeof(a.arguments[i]) != 'undefined')
ret = a.arguments[i];
break;
return ret;
Spry.Widget.Utils.getSelectorTokens = function(str)
str = str.replace(/\./g, ' .');
str = str.replace(/\#/g, ' #');
str = str.replace(/^\s+|\s+$/g,"");
return str.split(' ');
Spry.Widget.Utils.hasSelector = function(el, tokens)
for (var i =0; i< tokens.length; i++)
switch (tokens[i].charAt(0))
case '.': if (!el.className || el.className.indexOf(tokens[i].substr(1)) == -1) return false; break;
case '#': if (!el.id || el.id != tokens[i].substr(1)) return false; break;
default: if (el.nodeName.toLowerCase != tokens[i]) return false; break;
return true;
Spry.Widget.Utils.addEventListener = function(element, eventType, handler, capture)
try
if (element.addEventListener)
element.addEventListener(eventType, handler, capture);
else if (element.attachEvent)
element.attachEvent("on" + eventType, handler);
catch (e) {}
Spry.Widget.Utils.getStyleProperty = function(element, prop)
var value;
var camelized = Spry.Widget.Utils.camelize(prop);
try
if (element.style)
value = element.style[camelized];
if (!value)
if (document.defaultView && document.defaultView.getComputedStyle)
var css = document.defaultView.getComputedStyle(element, null);
value = css ? css.getPropertyValue(prop) : null;
else if (element.currentStyle)
value = element.currentStyle[camelized];
catch (e) {}
return value == 'auto' ? null : value;
Spry.Widget.Utils.camelize = function(str)
if (str.indexOf('-') == -1)
return str;
var oStringList = str.split('-');
var isFirstEntry = true;
var camelizedString = '';
for(var i=0; i < oStringList.length; i++)
if(oStringList[i].length>0)
if(isFirstEntry)
camelizedString = oStringList[i];
isFirstEntry = false;
else
var s = oStringList[i];
camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
return camelizedString;
* Spry.Widget.Utils.getPixels
* returns the value of a CSS property as Int, converting medium to 2
* @param {DOMElement} m - elements
* @param {String} s -
Spry.Widget.Utils.getPixels = function (m, s)
var v = Spry.Widget.Utils.getStyleProperty(m, s);
if (v == "medium") {
v = 2;
} else {
v = parseInt(v, 10);
v = isNaN(v)?0:v;
return v;
Spry.Widget.Utils.getAbsoluteMousePosition = function(ev)
var pos = {x:0, y:0};
if (ev.pageX)
pos.x = ev.pageX;
else if (ev.clientX)
pos.x = ev.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
if (isNaN(pos.x)) pos.x = 0;
if (ev.pageY)
pos.y = ev.pageY;
else if (ev.clientY)
pos.y = ev.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
if (isNaN(pos.y)) pos.y = 0;
return pos;
* Spry.Widget.Utils.getBorderBox
* returns a border box object (x,y,width,height) which perfectly covers the el element and its borders
* the x, y are absolute coordinates measured from from the window viewport
* use the box as the second parameter in Spry.Widget.Utils.setBorderBox
* @param {DOMElement or String} el -
* @param {DOMDocument,optional} doc -
Spry.Widget.Utils.getBorderBox = function (el, doc)
doc = doc || document;
if (typeof el == 'string')
el = doc.getElementById(el);
if (!el)
return false;
if (el.parentNode === null || Spry.Widget.Utils.getStyleProperty(el, 'display') == 'none')
//element must be visible to have a box
return false;
var ret = {x:0, y:0, width:0, height:0};
var parent = null;
var box;
if (el.getBoundingClientRect) { // IE
box = el.getBoundingClientRect();
var scrollTop = doc.documentElement.scrollTop || doc.body.scrollTop;
var scrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft;
ret.x = box.left + scrollLeft;
ret.y = box.top + scrollTop;
ret.width = box.right - box.left;
ret.height = box.bottom - box.top;
} else if (doc.getBoxObjectFor) { // gecko
box = doc.getBoxObjectFor(el);
ret.x = box.x;
ret.y = box.y;
ret.width = box.width;
ret.height = box.height;
var btw = Spry.Widget.Utils.getPixels(el, "border-top-width");
var blw = Spry.Widget.Utils.getPixels(el, "border-left-width");
ret.x -= blw;
ret.y -= btw;
} else { // safari/opera
ret.x = el.offsetLeft;
ret.y = el.offsetTop;
ret.width = el.offsetWidth;
ret.height = el.offsetHeight;
parent = el.offsetParent;
if (parent != el)
while (parent)
ret.x += parent.offsetLeft;
ret.y += parent.offsetTop;
parent = parent.offsetParent;
var blw = Spry.Widget.Utils.getPixels(el, "border-left-width");
var btw = Spry.Widget.Utils.getPixels(el, "border-top-width");
ret.x -= blw;
ret.y -= btw;
// opera & (safari absolute) incorrectly account for body offsetTop
var ua = navigator.userAgent.toLowerCase();
if (Spry.is.opera || Spry.is.safari && Spry.Widget.Utils.getStyleProperty(el, 'position') == 'absolute')
ret.y -= doc.body.offsetTop;
if (el.parentNode)
parent = el.parentNode;
else
parent = null;
while (parent && parent.tagName != 'BODY' && parent.tagName != 'HTML')
ret.x -= (isNaN(parent.scrollLeft) ? 0 : parent.scrollLeft);
ret.y -= (isNaN(parent.scrollTop) ? 0 : parent.scrollTop);
if (parent.parentNode)
parent = parent.parentNode;
else
parent = null;
return ret;
* Spry.Widget.Utils.setBorderBox
* puts the element el to the location specified by box
* @param {DOMElement} el - the element to be placed
* @param {Object} box - hash containing the x and y coordinates where to put el
Spry.Widget.Utils.setBorderBox = function (el, box) {
var pos = Spry.Widget.Utils.getBorderBox(el, el.ownerDocument);
if (pos === false)
return false;
var delta = {
x:Spry.Widget.Utils.getPixels(el, 'left'),
y:Spry.Widget.Utils.getPixels(el, 'top')
var new_pos = {x:0, y:0, w:0, h:0};
if (typeof box.x == 'number') {
new_pos.x = box.x - pos.x + delta.x;
if (typeof box.y == 'number') {
new_pos.y = box.y - pos.y + delta.y;
if (typeof box.x == 'number') {
el.style.left = new_pos.x + 'px';
if (typeof box.y == 'number') {
el.style.top = new_pos.y + 'px';
return true;
Spry.Widget.Utils.putElementAt = function (source, target, offset, biv)
biv = Spry.Widget.Utils.firstValid(biv, true);
var source_box = Spry.Widget.Utils.getBorderBox(source, source.ownerDocument);
Spry.Widget.Utils.setBorderBox(source, target);
if (biv)
Spry.Widget.Utils.bringIntoView(source);
return true;
* Spry.Widget.Utils.bringIntoView
* set the position of the source element so it is completely visible in the window
* @param {DOMElemenet} source - the element to be
Spry.Widget.Utils.bringIntoView = function (source) {
var box = Spry.Widget.Utils.getBorderBox(source, source.ownerDocument);
if (box === false) {
return false;
var current = {
x:Spry.Widget.Utils.getPixels(source, 'left'),
y:Spry.Widget.Utils.getPixels(source, 'top')
var delta = {x:0, y:0};
var offset_fix = {x:0, y:0};
var strictm = source.ownerDocument.compatMode == "CSS1Compat";
var doc = (Spry.is.ie && strictm || Spry.is.mozilla)?source.ownerDocument.documentElement:source.ownerDocument.body;
offset_fix.x = Spry.Widget.Utils.getPixels(doc, 'border-left-width');
offset_fix.y = Spry.Widget.Utils.getPixels(doc, 'border-top-width');
var st = doc.scrollTop;
var ch = self.innerHeight ? self.innerHeight : doc.clientHeight;
var t = box.y + (Spry.is.ie?-offset_fix.y:offset_fix.y);
var b = box.y + box.height + (Spry.is.ie?-offset_fix.y:offset_fix.y);
if ( b - st > ch) {
delta.y = ch - (b - st);
if (t + delta.y < st) {
delta.y = st-t;
} else if (t < st) {
delta.y = st - t;
if (delta.y != 0) {
source.style.top = (current.y + delta.y) + 'px';
var sl = doc.scrollLeft;
var cw = doc.clientWidth;
var l = box.x + (Spry.is.ie?-offset_fix.x:offset_fix.x);
var r = box.x + box.width + (Spry.is.ie?-offset_fix.x:offset_fix.x);
if ( r - sl > cw) {
delta.x = cw - (r - sl);
if (l + delta.x < sl) {
delta.x = sl-l;
} else if (l < sl) {
delta.x = sl - l;
if (delta.x != 0) {
source.style.left = (current.x + delta.x) + 'px';
Spry.Widget.Utils.contains = function (who, what) {
if (typeof who.contains == 'object') {
return what && who && (who == what || who.contains(what));
} else {
var el = what;
while(el) {
try{
if (el == who) {
return true;
el = el.parentNode;
}catch(a){return false;}
return false;
})(); // EndSpryComponent
@charset "UTF-8";
/* SpryTooltip.css - version 0.2 - Spry 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/* HACK FOR IE: to make sure the tooltips show above form controls, we underlay each tooltip with an iframe */
.iframeTooltip
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
.tooltipContent
font-size: 11px;
font-style: italic;
color: #332c40;
width: 96px;
height: 51px;
background: url(../_images/recipe/bubble2.png) no-repeat;
font-family: "Comic Sans MS", cursive;
margin: 0px;
left: -200px;
top: -200px;
padding-top: 5px;
vertical-align: middle;
position: fixed;

I couldn't get this script to work with my code:
<a id="greensource" href="a"><img src="images/greensource.png" alt="Greensource Initiative" width="193" height="71" border="0" usemap="#Map7" id="sprytrigger6" title="Greensource Initiative" />
<map name="Map7" id="Map7">
<area shape="rect" coords="-22,-15,197,79" href="#" />
</map>
</a>
<div class="tooltipContent" id="green">
<div class="secondback">
<div style="padding: 15px;">
<h1>GREENSOURCE</h1>
<h2>INITIATIVE™</h2>
<p>Manufactred within Greensource Initiative™ guildelines for use of recycled materials, renewable energy and non-hazardous packaging materials. RoHS Compliant.</p>
<p class="morebutton"><a href="#">LEARN MORE</a></p>
</div>
</div>
</div>
<script type="text/javascript">

</script>
Maybe someone can point out my problem?
CSS:
.tooltipContent
    margin: 0;
    padding: 0;
    background: #FFF url(../images/bottom-gradient.png) repeat-x bottom left;
    font-family: "Myriad Pro", Tahoma, Geneva, sans-serif;
    text-align: left;
    box-shadow: 2px 2px 4px #b6b5b6;
    -webkit-box-shadow: 2px 2px 4px #b6b5b6;
    -moz-box-shadow: 2px 2px 4px #b6b5b6;
    position: fixed;
#green {
    position: absolute;
    border: none;
    top: 200px;
    left: 200px;

Irritating Tool Tip on image file location

My complied web help (RoboHelp Word) shows an irritating tool
tip on the location and file name of the images when the mouse is
placed over the images. How do I disable this?

Hi jothi21 and welcome to our community
Personally, I try like heck to avoid mixing Word and
RoboHelp, but it does appear here that you actually LIKE this
combination.
If this were RoboHelp HTML. I'd tell you to double-click the
offending image and look in the
Screen tip field. I'm hopeful here that Word might offer the
same thing if you double click your image there. If not, try right
clicking the image and see what options you have. The goal is to
see if RoboHelp will offer some option to insert the same thing in
the RoboHelp for Word version.
Cheers... Rick

Tool Tip Display Disappears/Bug/Glitch

Hello,
I am having an issue with the tool tip function. When i mouse over multipe triggers quickly and then stop. The tool tip displays comes on and then disppaears. This is happening on multiple sites that i have. here is one example.
http://hoyin.gorillaboston.com/index.html
If you mouse over the yellow boxes you will see the display come on. The yellow boxes are the triggers alone with a color fill provided by muse. If you scroll through them quickly and then stop at one, even if you are in the dead center of the trigger and it recognizes it's on rollover, the display will appear and disappear.
HELP!
Thanks Adobe Community!

From more testing it seems that chrome is not recognizing when I mouse over the trigger for the tool tip to become active but instead stay on the mouse over state.

J Tool Tips - Strange and Awkward Bug

Hello Everyone,
I am having a very strange J Tool Tip bug. Okay first of all, the tool tip that I have created works when it is inside of a single panel for a single label. Basically, what I have is a number of J Labels - each having a unique tool tip. Here is the most basic of my code (notice that I have customized my own Tool Tip to have a yellow background and black foreground):
currentLabel = new JLabel("LABEL TEST")
            // Extends the JLabel and overrides createToolTip() to return a custom tool tip:
            @Override
            public JToolTip createToolTip()
                JToolTip toolTip = super.createToolTip();
                toolTip.setComponent(this);
                toolTip.setBackground(Color.YELLOW);
                toolTip.setForeground(Color.BLACK);
                return toolTip;
        currentLabel.setToolTipText("Testing Tool Tip Message");Okay, so here's the deal. Here's the tricky part. When I have this label nested inside of a Grid Bag Layout Panel, it works perfectly fine. It shows up when the user's mouse hovers over the label.
Here's my problem. The project that I am working on is actually nested in many complicated panels. This project has about 100 java files, so I am just going to cut it short and let you know which kind of panels it is nested in.
Starting from the lowest panel:
1. J Panel (Grid Bag Layout)
2. J Panel (Box Layout)
3. J Panel (Border Layout)
4. J Split Pane (Right Side)
5. J Panel (Border Layout) (Largest Panel)
One of the things I noticed is that now when I hover over the labels, a very small microscopic blue dot appears right to the left of the mouse cursor. I seriously think this is the Tool Tip, but for some reason it isn't showing any text. The strange thing is that the tool tip works when panels 2, 3, 4, and 5 are non-existent. If you guys have any ideas or suggestions, please let me know! I'd really appreciate it!
Thanks,
Brian

What I might do is : see if listening for mouseEntered and mouseExited events work on the labels when in their complex arrangement. And make a little tooltip class based on JWindow (perhaps with a JLabel on its contentpane so you can display HTML). I found this approach more reliable. Though one would expect this is what is already implemented, the inbilt behaviour may overcomplicate things resulting in some no-shows. I seem to remember having this problem with tootips on table cell renderers.
Edited by: kina_tji on Jul 23, 2008 6:33 PM

JSlider + Display value in a text tool tip box

Hello,
I am new to Java. I want to display the value in a text tool tip box of the JSlider as the user moves the knob . Is there any way to achieve this.
I tried setting up the value of text tool tip in the stateChanged method. But that didn't helped
Ritesh

Finally Got it working. Below I am attaching the code for reference
Thanks for your code. It came very handy
The only problem is that toolTextTip is appearing on one side rather than below the cursor.
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.event.*;
public class EventTest
public static void main(String[] args)
JFrame f = new JFrame();
System.out.println("starting application");
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.getContentPane().add(new setSlider(),"North");
JSlider slide = new JSlider();
slide.setToolTipText("Hello");
f.getContentPane().add(slide,"South");
f.setSize(400,400);
f.setLocation(200,200);
f.setVisible(true);
class setSlider extends JSlider implements ChangeListener, MouseMotionListener{
public setSlider(){
setToolTipText("hello " + new Integer(getValue()).toString());
this.setMaximum(10);
this.setMinimum(0);
this.setValue(2);
this.setMajorTickSpacing(2);
this.setMinorTickSpacing(1);
this.setPaintTicks(true);
this.setPaintLabels(false);
this.addMouseMotionListener(this);
this.addChangeListener(this);
public void stateChanged(ChangeEvent e) {
setToolTipText(new Integer(getValue()).toString());
System.out.println(this.getToolTipText());
KeyStroke controlF1 = KeyStroke.getKeyStroke("control F1");
ActionListener toolTipAction = getActionForKeyStroke( controlF1 );
if (toolTipAction != null)     {
ActionEvent postTip = new ActionEvent(this, ActionEvent.ACTION_PERFORMED, "");
toolTipAction.actionPerformed( postTip );
public void mouseDragged(MouseEvent e){
System.out.println("here");
setToolTipText(new Integer(getValue()).toString());
System.out.println(this.getToolTipText());
KeyStroke controlF1 = KeyStroke.getKeyStroke("control F1");
ActionListener toolTipAction = getActionForKeyStroke( controlF1 );
if (toolTipAction != null)     {
ActionEvent postTip = new ActionEvent(this, ActionEvent.ACTION_PERFORMED, "");
toolTipAction.actionPerformed( postTip );
public void mouseMoved(MouseEvent e){

How to put Tool Tip in JSP page

Hello.
How can i put Tool Tip in JSP page and also html page.

title="value"
put this in all the tags whereever it is required

Html markup/tool tip appears on website

Similar Messages

Maybe you are looking for