The latest version of wz_tooltips is 5.31 and apparently the Wayback Machine didn't capture that. I am using it on two of my websites, and it continues to work beautifully.
I just today read that Mr. Zorn may have passed -- I hope it's not true, but if it is, I am saddened, as he did some great work!
I thought of maybe releasing it on WebCommons, but I'm also concerned about the legalities involved.
wz_tooltip: usage notes
by prettyscripts on 2010-05-14 16:45:00
free • javascript • html
i have previously posted about this javascript based bubble help tooltips 1.5 years ago. i decided to use this in a new project but sadly the website is gone. nowhere to download! no documentation!
after doing some research it was said walter zorn, the developer, passed away sometimes last year! don't know how much you can trust information found on the internet, but if this is true, this is really sad... he made some great free tools.
thankfully the website is not completely gone. somewhere further down the thread there's a link to archived version of the website. but it takes forever to load any of pages.
i'm just going to briefly document the usage for my own reference.
updated 11/04/2011
thanks to AnotherWZ_tootipFan who left a comment below, download and documentation is available at www.walterzorn.de (along with other scripts). it's from this site that it's confirmed that the author passed away in 2009. the site was continued by his family and friends.
download the file
i manged to find a copy downloaded years ago in my backup (v5.31). i'm not sure about the legality of making the file available to download from this website nor distributing the file. i don't want to get into any legal battle. please do not ask me to send you the file.
you should be able to download from the archived website (takes a long time to load) or find source code by searching google.
update: wz_tooltip project can be found on sourceforge. the file can be downloaded from the site. (thanks Steve who left the comment below.)
link the file
the code must be placed after the <body> tag. if it's placed where you normally link javascript files, ie between <head>, it won't work!
Code:
<html> | |
<head> | |
.... | |
</head> | |
<body> | |
<script type="text/javascript" src="wz_tooltip.js"></script> | |
.... | |
</body> | |
</html> |
to show tooltip
call Tip('tip text') and UnTip() in the event, eg
Code:
<a href="index.htm" onMouseOver="Tip('tip text')" onMouseOut="UnTip();">Homepage </a> |
note: the documentation says no onMouseOut event. if you don't use the event the bubble will follow your mouse all over the browser. so i suggest, use it!
tooltip as part of html content
call TagTotip('span_id') and create a <span> with this id with the tooltext somewhere in html content. the <span> content is automatically hidden when the page is loaded.
Code:
<a href="index.htm" onmouseover="TagToTip('tip_1')">Show Tip</a> | |
<span id="tip_1">tooltip inside a span</span> |
customizing
you can config the settings inside the code (where specified).
there are commands that can be passed with values, separated by commas, to Tip() and TagToTip().
Code:
onMouseOver="Tip('some tip text', COMMAND, value, COMMAND2, value2');" |
the commands
this is just notes from commands table from the website. please go to the archived website for detail. (i'm not copying the table here because i don't want to get into any copyright battle.)
- ABOVE - true or false
- BGCOLOR - html color or '' for no background
- BGIMG
- BORDERCOLOR
- BORDERSTYPE
- BORDERSTYLE - solid (default), dashed, dotted (others may not work)
- BORDERWIDTH
- CENTERMOUSE
- CLICKCLOSE - true or false
- CLOSEBTN - display close button, true or false
- CLOSEBUTNCOLORS - 4 comma separated values in square bracket [background color, text color, highlighted background color, highlighted text color]
- CLOSEBTNTEXT
- DELAY - tootip showed after specified timeout in milliseconds
- DURATION
- FADEOUT - fade out animation duration in milliseconds
- FIX - at fixed coordinates [x, y]
- FOLLOWMOUSE - true (defualt) or false
- FONTCOLOR
- FONTFACE
- FONTSIZE
- FONTWEIGHT
- OFFSETX - can be negative
- OFFSETY - can be negative
- OPACITY - between 0 (opaque) and 100 (transparent)
- PADDING
- SHADOW - true or false
- SHADOWCOLOR
- STICKY - true or false
- TEXTALIGN - right, center, justify, left
- TITLE - display title bar, text in single quotes
- TITLEALIGN - right, center, justify, left
- TITLEFONTCOLOR
- TITLEFONTFACE
- TITLEFONTSIZE
- WIDTH
9 comments
Herr Zorn omitted HEIGHT from his original docs. It works the same way as WIDTH.
--johnt
--johnt
Comment by Steve @ 2010-09-06 13:57:11
I've just (6th Sept 2010) downloaded from here:http://sourceforge.net/projects/wztip/files/wz_tip/5.3.x/wz_tooltip531.zip/download
Comment by prettyscripts @ 2010-09-06 15:09:29
@steve, thanks so much for the info. post updated. :)
Comment by Stef_France @ 2010-12-30 12:17:16
Sad news, if true.
Be careful, some commands require quotes :
this.T_TEXTALIGN='right';
Some don't require quotes :
this.T_STICKY=true;
This archive provides a better table, with examples :
http://web.archive.org/web/20070101131806/http://www.walterzorn.com/tooltip/tooltip_e.htm
You probably could make a copy of this table on your website ?
Be careful, some commands require quotes :
this.T_TEXTALIGN='right';
Some don't require quotes :
this.T_STICKY=true;
This archive provides a better table, with examples :
http://web.archive.org/web/20070101131806/http://www.walterzorn.com/tooltip/tooltip_e.htm
You probably could make a copy of this table on your website ?
Comment by grumpy @ 2011-02-09 06:43:15
right is not a type while true is of type boolean.
hence the need for quotes on 'right' and not on true.
hence the need for quotes on 'right' and not on true.
Comment by WZ_ToolTipLover @ 2011-03-24 04:16:49
I am sad too to hear about Mr. Zorn if that is indeed true. Wow, that's just not good...
I really love this script but I've noticed that now that I have updated to Firefox 4 that the opacity setting doesn't work in that browser. In IE9 and Firefox 3.6.x it works still but now that Firefox 4 is one day old - the opacity is no longer transparent. Here is a temp URL for a photo gallery instructions on a web site I am developing for a client: http://quickwinch.ca/testing/gallery.php
You can try it in any browser other than FF4 and it will be see through. I don't know how to trouble shoot this or fix it. Any ideas?
I really love this script but I've noticed that now that I have updated to Firefox 4 that the opacity setting doesn't work in that browser. In IE9 and Firefox 3.6.x it works still but now that Firefox 4 is one day old - the opacity is no longer transparent. Here is a temp URL for a photo gallery instructions on a web site I am developing for a client: http://quickwinch.ca/testing/gallery.php
You can try it in any browser other than FF4 and it will be see through. I don't know how to trouble shoot this or fix it. Any ideas?
Comment by AnotherWZ_tootipFan @ 2011-04-06 07:15:20
WZ_ToolTipLover, you are using an older version of wz_tooltip js (4.12). I don't get the same problem with the latest version (5.31)
You can download it from here:-
http://www.walterzorn.de/en/tooltip/tooltip_e.htm
You can download it from here:-
http://www.walterzorn.de/en/tooltip/tooltip_e.htm
As some of our users have found out, Walter Zorn's libraries are here again
- but at a new URL, www.walterzorn.de/en
It seems to be a copy of his original site, complete with source texts and reference manuals.
We should all be grateful to Walter Zorn's family and friends who undertook to reconstruct his site at the new location.
The libraries that can be downloaded from there as .zip files seem fully up-to-date. Here are some version numbers:
wz_tooltip.js Version 5.31;
wz_jsgraphics.js Version 3.05;
wz_dragdrop.js Version 4.91.
I was unable to find more recent versions, despite considerable searching, after the old www.walterzorn.com ceased to exist in its original form.
Regarding legal issues, an "Impressum" at the new site says that intellectual rights must still be respected. As it happens, any of the JavaScript source texts can be redistributed and/or modified under the LGPL licence terms that appear in the comment.
And a technical issue:
In case Notepad scrambles an un-zipped source text, try WordPad.
There are surprisingly few posts about dragdrop here at Prettyscripts, and none at all about jsgraphics, as far as I can see. I have used both of them during the past three years, with good results.
With jsgraphics, vector graphics is drawn directly in the browser. Visitors to your site can see the graphics without having to install anything. JavaScript must, of course, be enabled. The graphics is composed of div elements of user-defined colours. As many pixels as possible are combined into each div element. The jsgraphics library is well suited for many kinds of graphics where speed is not critical. It is not fast enough for high-performance tasks such as computer games.
In dragdrop, div elements can be dragged and resized with the mouse. One draggable element can be a child of another. Children will follow suit when the latter "parent" element is dragged. Children can still be dragged individually. A draggable div element can be used as a canvas for jsgraphics.
I have found that these libraries can do more than promised in the reference manuals. A couple of examples can be seen at
www.bjarne.altervista.org
in case someone is interested.
Be sure to visit Walter Zorn's site at the new location
www.walterzorn.de/en
- or, for that matter, at www.walterzorn.de, which is in German.
Regards
Bjarne Pagh Byrnak
- but at a new URL, www.walterzorn.de/en
It seems to be a copy of his original site, complete with source texts and reference manuals.
We should all be grateful to Walter Zorn's family and friends who undertook to reconstruct his site at the new location.
The libraries that can be downloaded from there as .zip files seem fully up-to-date. Here are some version numbers:
wz_tooltip.js Version 5.31;
wz_jsgraphics.js Version 3.05;
wz_dragdrop.js Version 4.91.
I was unable to find more recent versions, despite considerable searching, after the old www.walterzorn.com ceased to exist in its original form.
Regarding legal issues, an "Impressum" at the new site says that intellectual rights must still be respected. As it happens, any of the JavaScript source texts can be redistributed and/or modified under the LGPL licence terms that appear in the comment.
And a technical issue:
In case Notepad scrambles an un-zipped source text, try WordPad.
There are surprisingly few posts about dragdrop here at Prettyscripts, and none at all about jsgraphics, as far as I can see. I have used both of them during the past three years, with good results.
With jsgraphics, vector graphics is drawn directly in the browser. Visitors to your site can see the graphics without having to install anything. JavaScript must, of course, be enabled. The graphics is composed of div elements of user-defined colours. As many pixels as possible are combined into each div element. The jsgraphics library is well suited for many kinds of graphics where speed is not critical. It is not fast enough for high-performance tasks such as computer games.
In dragdrop, div elements can be dragged and resized with the mouse. One draggable element can be a child of another. Children will follow suit when the latter "parent" element is dragged. Children can still be dragged individually. A draggable div element can be used as a canvas for jsgraphics.
I have found that these libraries can do more than promised in the reference manuals. A couple of examples can be seen at
www.bjarne.altervista.org
in case someone is interested.
Be sure to visit Walter Zorn's site at the new location
www.walterzorn.de/en
- or, for that matter, at www.walterzorn.de, which is in German.
Regards
Bjarne Pagh Byrnak
Comment feed for this postLeave a comment
Affiliates
©2012 by prettyscripts.• powered by b2evolution • skin by prettyscripts