Advanced Tooltips Support Product Page
In progress
Tooltip displays in wrong place in some browsers
Reported 13 years ago
3
have this problem
13 years ago Neil Morphew posted:
I wanted to add this problem even though I found a solution to it, so that it may help others in the future.When I added a tooltip to the <a> tag it worked correctly in Safari & Chrome but not in IE9 (although IE8 worked), Opera & Firefox. In those browsers it would be offset from where it should be, although the tooltip itself worked OK.
If I moved the tooltip behavior to the <image> tag that was within the <a> tag, it positioned correctly in all browsers.
Just something to bear in mind if you have a similar problem.
By the way I was using <!DOCTYPE HTML> which seems to cause another problem with the tooltips so it may be worth looking into that as well.
Hope it helps.
Replies
Replied 13 years ago
13 years ago Teodor Kuduschiev replied:
Hello Neil,
Please provide a link to your page.
Please provide a link to your page.
Replied 12 years ago
12 years ago Sam Bisignano replied:
Teodor and Neil,
I had the same problem with the ToolTip not being displayed where it should. It was showing up correctly, but at the top of the page. I tested it on three different Servers.
A Linux Server - shared web hosting plan
A Linux Server - Dedicated Managed Server
A Windows Server 2008 - Dedicated Server.
It now works on all three servers and the problem I discovered is that for the Linux plans, the styles folder must be "Styles" not "styles". Seems like a simple problem, but it did make it all work.
All three files are identical with the exception of a title
Windows Server, Linux Server, etc.
Here is my code for the Linux Server - Shared Plan
:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="ScriptLibrary/jquery-latest.pack.js"></script>
<script type="text/javascript" src="ScriptLibrary/dmxTooltips.js"></script>
<script type="text/javascript">
<!--
function applyDMXTooltip(trigger) {//v1.5
if (arguments.length < 3 || !arguments[2]) return true; // ignore empty tooltips
window.stylesFolderName = 'Styles';
var arg = {};
var options = ['contentType', 'dataProvider','showEffect','easing','showAt',
'showDirection', 'showDuration','showDelay','closeEvent','styleTheme',
'showCloseBtn','onshow','onhide','mouseOffsetX','mouseOffsetY','x','y','w','h'];
for (var i = 0; i < options.length && i < arguments.length-1; i++) {
arg[options[i]] = arguments[i + 1];
}
showTooltip(trigger, arg);
}
//-->
</script>
</head>
<body>
<p> </p>
<p>Linux Server - Shared Plan</p>
<p> </p>
<p>Create Rich Media ToolTips, provide online help, zoom in to images, display <a href="#" onmouseover="applyDMXTooltip(this,'','Rich Media Content can contain a combination of forms','fade','easeOutQuad','mouse','in',600,600,'mouseout','bluebevel',false,'','',0,0,'auto','auto','auto','auto')">rich content</a> and tips with just a few clicks.</p>
<p> </p>
</body>
</html>
I had the same problem with the ToolTip not being displayed where it should. It was showing up correctly, but at the top of the page. I tested it on three different Servers.
A Linux Server - shared web hosting plan
A Linux Server - Dedicated Managed Server
A Windows Server 2008 - Dedicated Server.
It now works on all three servers and the problem I discovered is that for the Linux plans, the styles folder must be "Styles" not "styles". Seems like a simple problem, but it did make it all work.
All three files are identical with the exception of a title
Windows Server, Linux Server, etc.
Here is my code for the Linux Server - Shared Plan
:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="ScriptLibrary/jquery-latest.pack.js"></script>
<script type="text/javascript" src="ScriptLibrary/dmxTooltips.js"></script>
<script type="text/javascript">
<!--
function applyDMXTooltip(trigger) {//v1.5
if (arguments.length < 3 || !arguments[2]) return true; // ignore empty tooltips
window.stylesFolderName = 'Styles';
var arg = {};
var options = ['contentType', 'dataProvider','showEffect','easing','showAt',
'showDirection', 'showDuration','showDelay','closeEvent','styleTheme',
'showCloseBtn','onshow','onhide','mouseOffsetX','mouseOffsetY','x','y','w','h'];
for (var i = 0; i < options.length && i < arguments.length-1; i++) {
arg[options[i]] = arguments[i + 1];
}
showTooltip(trigger, arg);
}
//-->
</script>
</head>
<body>
<p> </p>
<p>Linux Server - Shared Plan</p>
<p> </p>
<p>Create Rich Media ToolTips, provide online help, zoom in to images, display <a href="#" onmouseover="applyDMXTooltip(this,'','Rich Media Content can contain a combination of forms','fade','easeOutQuad','mouse','in',600,600,'mouseout','bluebevel',false,'','',0,0,'auto','auto','auto','auto')">rich content</a> and tips with just a few clicks.</p>
<p> </p>
</body>
</html>
Replied 12 years ago
12 years ago Vulcho Vulev replied:
Hello Sam.
Thank you for your contribution.
Regards:Vulcho.
Thank you for your contribution.
Regards:Vulcho.