New on DHTMLGoodies.com:
DHTML Chess is now available for WordPress at WordPressChess.com.
Download Ajax tooltip
Licensing
This script is distributed under the LGPL open source license.
Commercial licenses are also available. Some of these licenses also includes personal e-mail support for up to 1 year.
Download script
You can download the entire script from this Zip file
Files included in the package:
- ajax-tooltip.html = Main HTML file
- js/ajax-tooltip.js = Main JS file for the script>
- js/ajax.js = Ajax (SACK library)
- js/ajax-dynamic-content.js = The dynamic content script from this site
- css/ajax-tooltip.css = CSS for tooltip
- css/ajax-tooltip-demo.css = CSS for the demo
- images/arrow.gif = Arrow used in the tooltip
- demo-pages = External files loaded by the tooltip
Configuration
First, you need to include the js files and css files as in the demo(ajax-tooltip.html)
The tooltip is called by a mouseover event applied to an <A> tag. Example:
<a href="#" onmouseover="ajax_showTooltip('demo-pages/ajax-tooltip.html',this);return false" onmouseout="ajax_hideTooltip()">
The layout(size, colors and arrow) is defined in the CSS.
I'm using your tooltip tool and its great, though I'd like to know how the tip can be placed dynamically based on the position of the content. for example the tip is always displayed to the right, but what if the tip is not readable, so it should be displayed to the left and the same if the tip is displayed at the bottom of the page, again not readable and hence display it above the content?
I tried changing the offset values in the ajax-tooltip.js script, but that doesn't work, as the variable don't seem to be used at all.
so how to change the position, based on the above?
Regards
Keith
onmouseout="ajax_hideTooltip()
IE8 show error on onmouseout="ajax_hideTooltip
ERROR like this
Webpage error details
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; GTB6.6; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET4.0C; .NET4.0E; .NET CLR 1.1.4322; InfoPath.3)
Timestamp: Tue, 15 Mar 2011 10:08:54 UTC
Message: 'ajax_tooltipObj.style' is null or not an object
Line: 117
Char: 2
Code: 0
URI: http://208.109.91.116/union/scripts/ajax-tooltip.js
I am testing you tooltip and it seems to be exactly what I am looking for, except for one small issue. I have a list of categories and when you mouse over the name it displays the totals (total.php?id=$id) for each one. The problem is that if you drag the mouse over several of them, then stop on one, the totals keep updating the ones you dragged across until it gets to the one you stopped on. Is there a way to delay reading the link until your mouse is stopped for a couple of seconds?
Regards,
Jeff
Do you have any idea why its not showing the page content? I'm using IE8.
Thanks
Post your comment
Comment preview: