PolyTooltip v1.1 – an easy to use javascript tooltip script
Finished scripts, Javascript Add commentsThis script generates tooltips, small information boxes on your website. It’s good looking and very simple to use.
Examples
Tooltip on a link:
Tooltip on an image:
Tooltip with HTML tags:
„Lorem ipsum dolor sit amet, consectetuer sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
How to use
1. PolyTooltip uses the Prototype Framework and Scriptaculous Effects Library. You will need to include the following three Javascript files in the head of your HTML file (in this order).
| <script src="poly_tooltip/prototype.js" type="text/javascript"></script> <script src="poly_tooltip/scriptaculous.js" type="text/javascript"></script> <script src="poly_tooltip/tooltip.js" type="text/javascript"></script> |
2. The package includes some predefined styles (in the styles folder). Use one of them (or create a new one) by including the corresponding css file in the head of your HTML file.
| <link rel="stylesheet" type="text/css" href="poly_tooltip/styles/standard/tooltip.css" /> |
3. To activate PolyTooltip for a HTML element, just add a class=”poly_tooltip” to it, and write the tooltip text in the title attribute, e.g.
| <a href=”http://www.polymorph.at” class=”poly_tooltip” title=”This company rocks!”>Webdesign</a> |
or
| <img src=”http://www.polymorph.at/images/sidepic_cofe.jpg” class=”poly_tooltip” title=”mmmh… coffee” /> |
June 5th, 2011 at 1:03 pm
I’ve been looking for some time to get a high-quality articles or blog posts on the subject of this kind of field . Looking in Google I ultimately identified this fabulous site. Looking at this information So i’m happy to imply that I’ve got a wonderful impression I located everything that I was ready for. Most definitely i’ll ensure to don’t forget this website and look constantly.