Full version: jsB@nk » Utility » Tigra Hints
URL: https://www.javascriptbank.com/tigra-hints-index.html
Tigra Hints is a free JavaScript widget that displays pop-up box with notes when the mouse appears over any HTML element on the page (also known as tool tips or hints).
Full version: jsB@nk » Utility » Tigra Hints
URL: https://www.javascriptbank.com/tigra-hints-index.html
<script language="JavaScript" src="hints.js"></script><script language="JavaScript" src="hints_cfg.js"></script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<table border="0" cellspacing="1" cellpadding="3" width="100%"><tr><td class="header2">Pictures:</td></tr><tr> <td> <p>Full sized images that can't normally fit into your design can be shown with Tigra Hints. Check out the demo below.</p> <table align="center" cellpadding="0"cellspacing="0" border="0" bgcolor="black"> <tr><tdbackground="img/film.gif" height="14"><img src="img/pixel.gif"width="10" height="14"></td></tr><tr><td><img src="img/k001.jpg" width="100"onMouseOver="myHint.show(3)" onMouseOut="myHint.hide()"> <img src="img/k070.jpg" width="100" onMouseOver="myHint.show(4)"onMouseOut="myHint.hide()"> <img src="img/k020.jpg"width="100" onMouseOver="myHint.show(5)"onMouseOut="myHint.hide()"></td></tr> <tr><tdbackground="img/film.gif" height="14"><img src="img/pixel.gif"width="1" height="14"></td></tr> </table> <imgsrc="img/pixel.gif" width="1" height="10" border="0"></td></tr> <tr><tdclass="header2">Table:</td></tr> <tr> <td><p>Any HTML can be used inside Tigra Hints. This example demonstates tables containing additional contextual information nested into pop-up boxes.</p> <table bgcolor="#4682B4" align="center"cellpadding="1" cellspacing="0" border="0"> <tr><td><table cellpadding="3" cellspacing="1" width="100%"border="0" align="center"> <tr><td class="header2"align="center" colspan="6">W3C DOM Compatibility - CSS</td></tr> <tr><td class="header2"align="center"> </td> <td class="header2"align="center" width="65">IE 5 Win</td> <td class="header2"align="center" width="65">IE 6 Win</td> <td class="header2"align="center" width="65">IE 5.2 Mac</td> <tdclass="header2" align="center" width="65">Mozilla 1.2</td><td class="header2" align="center" width="65">Opera 7</td></tr> <tr bgcolor="#ffffff"><tdalign="left"><b>Element styles</b></td> <tdalign="center" onMouseOver="myHint.show(6)" onMouseOut="myHint.hide()"class="part">partially</td> <td align="center"onMouseOver="myHint.show(6)" onMouseOut="myHint.hide()"class="part">partially</td> <td align="center"onMouseOver="myHint.show(6)" onMouseOut="myHint.hide()"class="part">partially</td> <td align="center"onMouseOver="myHint.show(7)" onMouseOut="myHint.hide()"class="part">partially</td> <td align="center"onMouseOver="myHint.show(8)" onMouseOut="myHint.hide()"class="part">partially</td> </tr> <trbgcolor="#ffffff"><td align="left"><b>Accessing style sheets</b></td> <td align="center"onMouseOver="myHint.show(9)" onMouseOut="myHint.hide()"class="part">partially</td> <td align="center"onMouseOver="myHint.show(9)" onMouseOut="myHint.hide()"class="part">partially</td> <tdalign="center">yes</td> <td align="center"onMouseOver="myHint.show(10)" onMouseOut="myHint.hide()"class="part">partially</td> <tdalign="center">no</td> </tr> <trbgcolor="#ffffff"><td align="left"><b>Changing style sheets</b></td> <td align="center"onMouseOver="myHint.show(11)" onMouseOut="myHint.hide()"class="part">partially</td> <td align="center"onMouseOver="myHint.show(11)" onMouseOut="myHint.hide()"class="part">partially</td> <tdalign="center">no</td> <td align="center"onMouseOver="myHint.show(12)" onMouseOut="myHint.hide()"class="part">partially</td> <tdalign="center">no</td> </tr> <trbgcolor="#ffffff"><td align="left"><b>Style sheet properties</b></td> <td align="center">yes</td><td align="center">yes</td> <tdalign="center">yes</td> <tdalign="center">yes</td> <td align="center">no</td></tr> <tr bgcolor="#ffffff"><tdalign="left"><b>Miscellaneous</b></td> <tdalign="center">no</td> <td align="center"onMouseOver="myHint.show(13)" onMouseOut="myHint.hide()"class="part">partially</td> <td align="center"onMouseOver="myHint.show(14)" onMouseOut="myHint.hide()"class="part">partially</td> <td align="center"onMouseOver="myHint.show(15)" onMouseOut="myHint.hide()"class="part">partially</td> <tdalign="center">no</td> </tr> </table> </td></tr> </table> <img src="img/pixel.gif" width="1"height="10" border="0"> </td> </tr> <tr><tdclass="header2">Div element:</td></tr> <tr><td> <p>Hints can also be transparent. See the demo below.</p><b><center><divstyle="background-color:#4682B4;border:1px outset #DBEAF5;width:140px;padding:10px;" onMouseOver="myHint.show(16)"onMouseOut="myHint.hide()"><spanclass="header1">About SoftComplex</span></div></center></b><img src="img/pixel.gif" width="1" height="10" border="0"></td> </tr> <tr><tdclass="header2">Links:</td></tr> <tr><td><p>Fancy design ideas can be implemented with Tigra Hints.</p> <table cellpadding="0" cellspacing="0" border="0"align="center"> <tr><td><b><li><ahref=""onMouseOver="myHint.show(0)" onMouseOut="myHint.hide()">Product page</a></b></td></tr><tr><td><b><li><ahref=""onMouseOver="myHint.show(1)" onMouseOut="myHint.hide()">Download Page</a></b></td></tr><tr><td><b><li><ahref=""onMouseOver="myHint.show(17)"onMouseOut="myHint.hide()">Documentation</a></b></td></tr><tr><td><b><li><ahref=""onMouseOver="myHint.show(2)" onMouseOut="myHint.hide()">Product forum</a></b></td></tr> </table> <imgsrc="img/pixel.gif" width="1" height="10" border="0"> </td></tr> <tr><tdclass="header2"> </td></tr> </table></td></tr></table><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
http://javascriptbank.com/javascript/utility/Tigra_Hints/hints.jshttp://javascriptbank.com/javascript/utility/Tigra_Hints/hints_cfg.js
