Rev 1372 | Blame | Compare with Previous | Last modification | View Log | RSS feed
$Id: README,v 1.1 2007-03-16 12:39:35 jp_milcent Exp $Project: DOM TooltipMaintainer: Dan Allen (Mojavelinux) <dan.allen@mojavelinux.com>Contributors:Josh Gross (JPortalHome) <josh@jportalhome.com>Jason Rust (CodeJanitor) <jason@rustyparts.com>License: Apache 2.0What is it?-----------This javascript library will allow you to have dynamic and configurabletooltips on your html pages. There are several other tooltip libraries on theweb, but you will find that this library is very complete and stable. Itincludes support for all the modern browsers and behaves in a consistent wayacross these platforms. This library does not support Netscape 4. Netscape 4is no longer an acceptable browser and it is time to move forward. That is whyI prefixed the project title with DOM. If your browser doesn't support the DOMstandard, then this library won't work.How does it work?-----------------This library supports Gecko (Mozilla/Netscape6+,Firefox, etc), IE 5.5+, IE onMac, Safari, Konqueror and Opera 7 (which includes full DOM and CSS2 support).The tooltips are configured through class definitions in your stylesheet andthe rest is up to javascript. The tooltips may consist of two parts, thecaption and the content. The caption is optional. The tips can either begreasy, sticky, or velcro. Greasy means that they move around when you movethe mouse around and go away when you leave the element. Sticky means that theystick around after you leave the element and are otherwise stationary. Velcrotips disappear after a mouseout occurs on the tip itself. The tooltips alsohave directionality, so you can have tips that are 'northeast', 'northwest','southeast' or 'southwest' of the mouse.Be sure to include the file 'domLib.js' whereever you use 'domTT.js' and if youwant to have draggable tips or opacity fading, include the 'domTT_drag.js' and'fadomatic.js' files as well. **Some of these libraries are available under thedomLib project.** Please see the HOWTO.html for details on how to use thelibrary and the options that are available.Why is this program so big?---------------------------Partly because it is feature rich and thus there is lots of code, partlybecause we try to use comments where ever necessary to clarify issues, andpartly because our coding style is one which makes liberal use of whitespace.However, to save your users the trouble of downloading 50k of JavaScript everytime they come to your page you can use Douglas Crockford's excellent jsminprogram to strip all non-essentials from the code, reducing it's size by asmuch as 50%. This program has been verified to work with his program, located at:http://www.crockford.com/javascript/jsmin.htmlAn example usage would be:bash# ./jsmin domTT.js domTT_min.js \"domTT is Copyright Dan Allen (dan.allen@mojavelinux.com) (2002 - 2005). Licensed under the Apache 2.0 license"Anything I should know?-----------------------Additionally, this tooltip library autodetects select boxes in IE and thescrollbar on multiple selects in mozilla (the only issue mozilla has) andHIDES them whenever the tooltip collides with them. Hence, it has fullcollision detection with components which cannot use the zIndex propery!!In order for it to work correctly you'll want to follow the example stylesheetpretty closely. It has been crafted to work well on all the supportedbrowsers. Note the body { margin: 0; } style which is needed if you want it towork decently on Mac IE and Opera. (According the W3C standard, a body cannothave a margin anyway).By default, the library accounts for the size of the mouse when the tip isin one of the two southern positions. If you need to turn off this correctionon a given tip, set the option 'clearMouse' to false. If the size of the mouseneeds to be adjusted, overwrite the global variable domTT_mouseHeight.In 0.7.1, the hiding of flash animations was added for those browsers thatcannot put html over top of flash. However, there are a couple ofrequirements. First, the syntax that must be used is:<objecttype="application/x-shockwave-flash"data="animation.swf"width="450px"height="250px"pluginspage="http://www.macromedia.com/go/getflashplayer"><param name="movie" value="animation.swf" /><param name="wmode" value="opaque" />...alternate (non-flash) html here!...</object>If you use the object+embed syntax, the flash will not be properly detected.The second requirement is that the flash must be included in an element with aposition of either absolute or relative. If it is not, the flash animationwill be relocated in the DOM and therefore will not be aware of its location onthe page, making collision detection worthless.Why did you write it?---------------------The reason I wrote this library is because I wanted a library which used 100%DOM to do the tooltips, was easy to configure, was fast, and which was freelydistributable. You may use this library in personal or company, open source orproprietry projects. I wrote it for you, so enjoy it. All I ask is that youspread the word and please give me credit by leaving in my comments. If youdo make patches, please let me know about them on my forums. Viva Open Source!!Important Changes in 0.7.1--------------------------Fading library is now fadomatic.js, so be sure to change your includewhen using the fade feature. This is a third party library developedby fadomatic@chimpen.com. You can find this library at the following URL:http://chimpen.com/fadomaticThe global setting domTT_classPrefix was changed to domTT_styleClass and theequivalent options without the domTT_ prefix in the domTT_activate() functioncall have been changed.Important Changes in 0.70-----------------------------IE 5.0 is no longer supported because its DOM implementation is just toocrippled. Many of the complaints about the positioning of the tips andthe screen edge detecting are now fixed.Important API Changes in 0.60------------------------------The release is 0.60 and it introduced several significant changes over the0.55 release. Several of the options have changed names. The following is alist:'status' -> 'statusText''close' -> 'closeAction''prefix' -> 'classPrefix''id' -> *no longer an option*There is also a new option 'trail' which is used in place of mousemove. Do notuse domTT_activate() in the onmousemove event handler any longer!!! It was fartoo slow to parse the same options all over again from onmouseover, so now justspecify the domTT_activate() in onmouseover with the option trail.Also to note, the functions domTT_true() and domTT_false() have been changed tomakeTrue() and makeFalse() respectively to make them more understandable.Be sure to include the file 'domLib.js' whereever you use 'domTT.js'and if you want to have draggable tips or opacity fading, include the'domTT_drag.js' and 'fadomatic.js' files as well.