WebSVN – wimsdev – Blame – /trunk/wims/public_html/scripts/js/tooltip

Rev	Author	Line No.	Line
67	bpr	1
		2	<style type="text/css">
		3	<!--
		4	.tt {
		5	font-size:12px;
		6	}
		7
		8	#T2tDirect {
		9	border:2px solid red;
		10	background:yellow;
		11	padding:3px;
		12	}
		13	-->
		14	</style>
		15	<script type="text/javascript">
		16	<!--
		17	function FixCalcXY(el)
		18	{
		19	if(typeof(el.offsetParent) == "undefined")
		20	return [70, 4000];
		21	var a = new Array(0, -70);
		22	while(el)
		23	{
		24	a[0] += el.offsetLeft \|\| 0;
		25	a[1] += el.offsetTop \|\| 0;
		26	el = el.offsetParent \|\| null;
		27	}
		28	return a;
		29	}
		30	//-->
		31	</script>
		32
		33	<table>
		34	<tbody><tr>
5787	bpr	35	<td width="50"><br/></td>
67	bpr	36	<td>
		37	<table bgcolor="#000099" border="0" cellpadding="0" cellspacing="0">
		38	<tbody><tr>
		39	<td>
		40	<table border="0" cellpadding="6" cellspacing="1" width="100%">
		41	<tbody><tr bgcolor="#eeeeee">
		42	<th align="left">Command</th>
		43	<th align="left">Description</th>
		44	</tr>
		45	<tr bgcolor="#ffffff" valign="top">
		46	<td>
		47	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Tooltip positioned above mouse pointer', ABOVE, true);">ABOVE</a></tt>
		48	</td>
		49	<td>
		50	Positions the tooltip above the mousepointer.
		51	Value: true or false.
5787	bpr	52	<br/> <br/>
67	bpr	53	Combine with
5787	bpr	54	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('These commands have been applied:<br/>ABOVE, true, OFFSETY, 50', ABOVE,true,OFFSETY,50);">OFFSETY</a></tt>
67	bpr	55	to adjust the vertical distance from the mousepointer,
		56	or with
5787	bpr	57	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('These commands have been applied:<br/>ABOVE, true, CENTERMOUSE, true', ABOVE, true, CENTERMOUSE, true, OFFSETX, 0);">CENTERMOUSE</a></tt>
67	bpr	58	to center the tooltip horizontally above the mousepointer.
		59	</td>
		60	</tr>
		61	<tr bgcolor="#ffffff" valign="top">
		62	<td>
		63	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Changed background color', BGCOLOR,'#f3e0f3');">BGCOLOR</a></tt>
		64	</td>
		65	<td>
		66	Background color of the tooltip.
		67	Value: HTML color, in single quotes, e.g. '#D3E3F6' or 'DarkCyan',
		68	or empty string <tt>''</tt> for
5787	bpr	69	<tt><a class="nodeco" href="javascript:void(0)" onmouseover="Tip('This tooltip has neither a background<br/>nor a border', BORDERWIDTH, 0, BGCOLOR, '', FONTWEIGHT, 'bold', FONTCOLOR, '#00AA00')">no background</a></tt>.
		70	<br/>Example:
		71	<br/>
67	bpr	72	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGCOLOR, '#D3E3F6')"</font></tt>
5787	bpr	73	<br/>or<br/>
67	bpr	74	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGCOLOR, '')"</font></tt>
		75	</td>
		76	</tr>
		77	<tr bgcolor="#ffffff" valign="top">
		78	<td>
		79	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Tooltip with background image', BGIMG, '../images/tooltip/tt_bg.jpg', PADDING, 10, WIDTH, 180);">BGIMG</a></tt>
		80	</td>
		81	<td>
		82	Background image.
		83	Value: Path to image, in single quotes.
5787	bpr	84	<br/>Example:
		85	<br/>
67	bpr	86	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BGIMG, '../images/tipbackground.gif')"</font></tt>
		87	</td>
		88	</tr>
		89	<tr bgcolor="#ffffff" valign="top">
		90	<td>
		91	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Altered border color', BORDERCOLOR, '#dd00aa');">BORDERCOLOR</a></tt>
		92	</td>
		93	<td>
		94	Border color.
		95	Value: HTML color, in single quotes, e.g. '#dd00aa'.
		96	</td>
		97	</tr>
		98	<tr bgcolor="#ffffff" valign="top">
		99	<td>
		100	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Dashed border style', BORDERSTYLE, 'dashed', PADDING, 8);">BORDERSTYLE</a></tt>
		101	</td>
		102	<td>
		103	Border style.
		104	Value: CSS border style, in single quotes.
		105	Recommend are 'solid' (default), 'dashed' or 'dotted', others may not work in all browsers.
		106	</td>
		107	</tr>
		108	<tr bgcolor="#ffffff" valign="top">
		109	<td>
		110	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Width of tooltip border', BORDERWIDTH, 5);">BORDERWIDTH</a></tt>
		111	</td>
		112	<td>
		113	Width of tooltip border.
		114	Value: Integer ≥ 0. Default is 1. Use 0 for no border.
5787	bpr	115	<br/>Example:
		116	<br/>
67	bpr	117	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', BORDERWIDTH, 2)"</font></tt>
		118	</td>
		119	</tr>
		120	<tr bgcolor="#ffffff" valign="top">
		121	<td align="right">
		122	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Centered beneath the mouse', CENTERMOUSE, true, OFFSETX, 0, OFFSETY, 22);">CENTERMOUSE</a></tt>
		123	</td>
		124	<td>
		125	Centers the tooltip horizontally beneath (or above) the mousepointer.
		126	Value: true or false.
		127	Consider that the tooltip is offset from the center by the value globally set in wz_tooltip.js (<tt>config. OffsetX</tt>), or as specified by the OFFSETX command.
5787	bpr	128	<br/>Example:
		129	<br/>
67	bpr	130	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', CENTERMOUSE, true, OFFSETX, 0)"</font></tt>
		131	</td>
		132	</tr>
		133	<tr bgcolor="#ffffff" valign="top">
		134	<td>
		135	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('This tooltip is "sticky", but it can be closed by clicking into the tooltip or document, since the command CLICKCLOSE, true has been applied.', CLICKCLOSE, true, STICKY, true, WIDTH, 300);">CLICKCLOSE</a></tt>
		136	</td>
		137	<td>
		138	Closes the tooltip once the user clicks somewhere inside the tooltip or into the document.
		139	Value: true, false.
		140	</td>
		141	</tr>
		142	<tr bgcolor="#ffffff" valign="top">
		143	<td>
		144	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Closebutton in the titlebar', CLOSEBTN, true, STICKY, true);">CLOSEBTN</a></tt>
		145	</td>
		146	<td>
		147	Displays a closebutton in the titlebar.
		148	Value: true, false.
		149	</td>
		150	</tr>
		151	<tr bgcolor="#ffffff" valign="top">
		152	<td>
		153	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Altered closebutton colors', CLOSEBTN, true, STICKY, true, CLOSEBTNCOLORS, ['#7799cc', '#ffaaaa', '#ffffff', '#ff0000']);">CLOSEBTNCOLORS</a></tt>
		154	</td>
		155	<td>
		156	Colors used for the closebutton.
5787	bpr	157	<br/> <br/>
67	bpr	158	Value must be a comma-separated array of 4 color values. Each color in
		159	single quotes. The entire array must be enclosed with a pair of square
		160	brackets, see example below, since it's actually a single parameter.
5787	bpr	161	The 4 colors have the following meanings: <br/>
67	bpr	162	1. Background color
5787	bpr	163	<br/>
67	bpr	164	2. Text color
5787	bpr	165	<br/>
67	bpr	166	3. Highlighted background, while the button is being hovered
5787	bpr	167	<br/>
67	bpr	168	4. Hilighted text color, while the button is being hovered
5787	bpr	169	<br/>
67	bpr	170	For each of these colors, you can also specify an empty string <tt>''</tt>,
		171	in which case the title background, or title text color, respectively, is used for that button state.
5787	bpr	172	<br/> <br/>
		173	Example:<br/>
67	bpr	174	<tt><font class="tt" size="2">Tip('Text', CLOSEBTN, true, CLOSEBTNCOLORS, ['', '#66ff66', 'white', '#00cc00'], STICKY, true)</font></tt>
5787	bpr	175	<br/>
67	bpr	176	In this example, the first color value (background color) is an empty string.
		177	Therefore the closebutton inherits the titlebar background.
		178	</td>
		179	</tr>
		180	<tr bgcolor="#ffffff" valign="top">
		181	<td>
		182	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Altered closebutton text', CLOSEBTN, true, STICKY, true, CLOSEBTNTEXT, 'Click Me');">CLOSEBTNTEXT</a></tt>
		183	</td>
		184	<td>
		185	Text in the closebutton.
		186	Value must be enclosed with single quotes.
		187	Example:
5787	bpr	188	<br/>
67	bpr	189	<tt><font class="tt" size="2">Tip('Tooltip text', CLOSEBTN, true, CLOSEBTNTEXT, 'Click Me', STICKY, true)</font></tt>
5787	bpr	190	<br/>
67	bpr	191	Globally preset in wz_tooltip.js is '&nbsp;X&nbsp;' - the
		192	whitespace entities '&nbsp;' add some horizontal padding to the
		193	button. </td>
		194	</tr>
		195	<tr bgcolor="#ffffff" valign="top">
		196	<td>
		197	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="TagToTip('T2tDirect', COPYCONTENT, false, PADDING, 0, BORDERWIDTH, 0, WIDTH, 280);">COPYCONTENT</a></tt>
		198	<div style="display: none;" id="T2tDirect">
		199	Actually, this DIV was embedded right into the HTML of the document,
		200	but it has been temporarily converted to a tooltip. </div>
		201	</td>
		202	<td>
		203	COPYCONTENT has only effect on tooltips created with <tt>TagToTip()</tt>, that is, if an HTML element is to be converted to a tooltip.
5787	bpr	204	<br/>
67	bpr	205	Value: true, false.
5787	bpr	206	<br/>
67	bpr	207	If true (this is the default behaviour preset in wz_tooltip.js), just a
		208	copy of the text (or inner HTML) of the HTML element is inserted into
		209	the tooltip. If false, the entire HTML element (its DOM node) by itself
		210	is temporarily converted to a tooltip, which may be useful in the
5787	bpr	211	following aspects: <br/> 1.) If the HTML element converted to a
67	bpr	212	tooltip contains a form with inputs, their current user input will be
5787	bpr	213	maintained even while the tooltip is not displayed. <br/>
67	bpr	214	2.) The tooltip inherits the style properties of the HTML element.
5787	bpr	215	<br/>
67	bpr	216	Example how to convert an HTML element entirely to a tooltip, by applying COPYCONTENT with the value <tt>false</tt>:
5787	bpr	217	<br/>
67	bpr	218	<tt><font class="tt" size="2">TagToTip('SomeID', COPYCONTENT, false, BORDERWIDTH, 0, PADDING, 0)</font></tt>
5787	bpr	219	<br/>
67	bpr	220	Moreover, this example turns off the native tooltip border
		221	(BORDERWIDTH, 0), and sets the native tooltip padding to zero, so
		222	only the padding and border defined for the HTML element itself are
		223	displayed. </td>
		224	</tr>
		225	<tr bgcolor="#ffffff" valign="top">
		226	<td>
5787	bpr	227	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Delay of 1000 ms until the tooltip shows up.<br/><br/>A small delay of 400 ms is preset in wz_tooltip.js (in the section "GLOBAL TOOLTIP CONFIGURATION") and can be changed there. Note, however, that values much shorter or longer than 500 ms might be perceived as irritating.', DELAY, 1000, WIDTH, 360);">DELAY</a></tt>
67	bpr	228	</td>
		229	<td>
		230	Tooltip shows up after the specified timeout, in milliseconds.
		231	A behavior similar to OS based tooltips.
5787	bpr	232	<br/>
67	bpr	233	Value:
		234	Integer ≥ 0. Use 0 for no delay.
		235	In wz_tooltip.js preset and recommended is 400.
5787	bpr	236	<br/>Example:
		237	<br/>
67	bpr	238	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', DELAY, 1000)"</font></tt>
		239	</td>
		240	</tr>
		241	<tr bgcolor="#ffffff" valign="top">
		242	<td>
		243	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Lifetime of this tip has been limited to 2500 milliseconds', DURATION, 2500);">DURATION</a></tt>
		244	</td>
		245	<td>
		246	Time span, in milliseconds, until the tooltip will be hidden,
		247	even if the <tt>STICKY</tt> command has been applied,
		248	or even if the mouse is still on the HTML element that has triggered the tooltip.
5787	bpr	249	<br/>
67	bpr	250	Value:
		251	Integer ≥ 0.
		252	Use 0 for no limitation (this is the default)
		253	</td>
		254	</tr>
		255	<tr bgcolor="#ffffff" valign="top">
		256	<td>
		257	<tt><a class="nodeco" href="javascript:void(0);" onmouseover=" Tip('Fade-in animation', FADEIN, 1000, PADDING, 10);">FADEIN</a></tt>
		258	</td>
		259	<td>
		260	Fade-in animation.
		261	The value (integer ≥ 0) specifies the duration of the animation, in milliseconds.
		262
5787	bpr	263	<br/> <br/>
67	bpr	264	Not supported in Opera prior to v.9.0, old versions of Safari, some versions of Konqueror.
		265	These fall back to normal, non-animated behaviour.
		266	</td>
		267	</tr>
		268	<tr bgcolor="#ffffff" valign="top">
		269	<td>
		270	<tt><a class="nodeco" href="javascript:void(0);" onmouseover=" Tip('Fade-out animation', FADEOUT, 1000, PADDING, 10);">FADEOUT</a></tt>
		271	</td>
		272	<td>
		273	Fade-out animation.
		274	The value (integer ≥ 0) specifies the duration of the animation, in milliseconds.
		275
5787	bpr	276	<br/> <br/>
67	bpr	277	Recommended: combine with
5787	bpr	278	<tt><a class="nodeco" href="javascript:void(0)" onmouseover="Tip('On another fast trip in Bavaria<br/><img src=\'../images/ko5obersoech.jpg\' width=\'180\' height=\'115\' \/>', FADEIN, 800, FADEOUT, 800, TEXTALIGN, 'center', BGCOLOR, '#ffffff')">FADEIN</a></tt>.
		279	<br/> <br/>
67	bpr	280	Not supported in Opera prior to v.9.0, old versions of Safari, some versions of Konqueror.
		281	These fall back to normal, non-animated behaviour.
		282	</td>
		283	</tr>
		284	<tr bgcolor="#ffffff" valign="top">
		285	<td>
		286	<tt><a class="nodeco" href="javascript:void(0);" onmouseover=" Tip('Tooltip at fixed position', FIX, FixCalcXY(this));">FIX</a></tt>
		287	</td>
		288	<td>
		289	Shows the tooltip at the fixed coordinates [x, y].
		290	Value: Square-bracketed array of two integers.
5787	bpr	291	Example:<br/>
67	bpr	292	<tt>onmouseover="Tip('Some text', FIX, [230, 874])"</tt>
5787	bpr	293	<br/>
67	bpr	294	You can also call function(s) defined elsewhere that calculate the coordinates dynamically:
5787	bpr	295	<br/>
67	bpr	296	<tt>onmouseover="Tip('Text', FIX, [CalcFixX(), CalcFixY()], BORDERWIDTH, 2)"</tt>
5787	bpr	297	<br/>
67	bpr	298	or
5787	bpr	299	<br/>
67	bpr	300	<tt>onmouseover="Tip('Text', FIX, CalcFixXY(), ABOVE, true)"</tt>
5787	bpr	301	<br/>
67	bpr	302	In the latter example, the function CalcFixXY() must return an array containing the two numbers.
		303	</td>
		304	</tr>
		305	<tr bgcolor="#ffffff" valign="top">
		306	<td>
		307	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('This tooltip doesn\'t follow the movements of the mouse since we\'ve applied the FOLLOWMOUSE command with the value false', FOLLOWMOUSE, false, WIDTH, 300);">FOLLOWMOUSE</a></tt>
		308	</td>
		309	<td>
		310	The tooltip follows the movements of the mouse.
		311	Value: true, false. Default: true.
5787	bpr	312	<br/> <br/>
67	bpr	313	When turning this off by applying the value false,
		314	the tooltip behaves like OS-based tooltips which don't follow the mouse.
		315	</td>
		316	</tr>
		317	<tr bgcolor="#ffffff" valign="top">
		318	<td>
		319	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Altered font color', FONTCOLOR, '#ff0000');">FONTCOLOR</a></tt>
		320	</td>
		321	<td>
		322	Font color.
		323	Value: HTML color, in single quotes, e.g. '#990099'
		324	</td>
		325	</tr>
		326	<tr bgcolor="#ffffff" valign="top">
		327	<td>
		328	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Changed font face', FONTFACE, 'Courier New, Courier, mono');">FONTFACE</a></tt>
		329	</td>
		330	<td>
		331	Font face (font family).
5787	bpr	332	<br/>
67	bpr	333	Value:
		334	As you'd specify it in HTML or CSS, enclosed with single quotes, e.g.
		335	<tt>Tip('Some text', FONTFACE, 'Arial, Helvetica, sans-serif', FONTSIZE, '12pt')</tt>
		336	</td>
		337	</tr>
		338	<tr bgcolor="#ffffff" valign="top">
		339	<td>
		340	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Oops...', FONTSIZE, '72pt');">FONTSIZE</a></tt>
		341	</td>
		342	<td>
		343	Font size.
		344	Value: Size with unit, in single quotes.
		345	Unit ('px', 'pt', 'em' etc.) is mandatory.
		346	</td>
		347	</tr>
		348	<tr bgcolor="#ffffff" valign="top">
		349	<td>
		350	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('FONTWEIGHT, \'bold\'', FONTWEIGHT, 'bold');">FONTWEIGHT</a></tt>
		351	</td>
		352	<td>
		353	Font weight.
		354	Value: 'normal' or 'bold', in single quotes.
		355	</td>
		356	</tr>
		357	<tr bgcolor="#ffffff" valign="top">
		358	<td align="right">
		359	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('On the other side', LEFT, true);">LEFT</a></tt>
		360	</td>
		361	<td>
		362	Tooltip positioned on the left side of the mousepointer.
		363	Value: true, false.
5787	bpr	364	<br/>
67	bpr	365	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('LEFT and ABOVE combined...', LEFT, true, ABOVE, true);">LEFT and ABOVE commands combined</a></tt>.
5787	bpr	366	<br/>Example:
		367	<br/>
67	bpr	368	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', LEFT, true, ABOVE, true)"</font></tt>
		369	</td>
		370	</tr>
		371	<tr bgcolor="#ffffff" valign="top">
		372	<td>
		373	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Increased horizontal offset from the mouse', OFFSETX, 150);">OFFSETX</a></tt>
		374	</td>
		375	<td>
		376	Horizontal offset from mouse-pointer.
		377	Value: Any integer. May also be negative.
		378	</td>
		379	</tr>
		380	<tr bgcolor="#ffffff" valign="top">
		381	<td>
		382	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Increased vertical distance from the mouse', OFFSETY, 70);">OFFSETY</a></tt>
		383	</td>
		384	<td>
		385	Vertical offset from the mouse-pointer.
		386	Value: Any integer. May also be negative.
		387	</td>
		388	</tr>
		389	<tr bgcolor="#ffffff" valign="top">
		390	<td>
		391	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('A semi-transparent Tooltip', OPACITY, 70, PADDING, 14);">OPACITY</a></tt>
		392	</td>
		393	<td>
		394	Transparency of tooltip.
		395	Value: Integer between 0 (fully transparent) and 100 (opaque, no transparency).
5787	bpr	396	<br/> <br/>
		397	Opacity is the opposite of transparency, i.e.<br/>
		398	opacity = 100 - transparency (in percent).<br/>
		399	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('<img src=../images/dragdrop/fateba_fi.jpg width=130 height=103/><br/>Tooltip with image, shadow, background image and fade-in/fade-out animation.', WIDTH, 180, OPACITY, 80, TEXTALIGN, 'center', TITLEALIGN, 'center', SHADOW, true, TITLE, 'Nifty', BGIMG, '../images/tooltip/tt_bg.jpg', FADEIN, 700, FADEOUT, 700);">Another example</a></tt>
67	bpr	400	with image (taken on my 9000-km / 5500-miles recumbent bicycle trip
		401	Hamburg-Northcape-Munich), shadow via SHADOW command, content centered
		402	using TEXTALIGN, background image via BGIMG and animation via FADEIN
5787	bpr	403	and FADEOUT commands. <br/> <br/>
67	bpr	404	Not supported in Opera prior to v.9.0, old versions of Safari and some versions of Konqueror.
		405	</td>
		406	</tr>
		407	<tr bgcolor="#ffffff" valign="top">
		408	<td>
		409	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Tip with plenty of padding around its content', PADDING, 30);">PADDING</a></tt>
		410	</td>
		411	<td>
		412	Inner spacing of tooltip, between border and content.
		413	Value: Integer ≥ 0.
		414	</td>
		415	</tr>
		416	<tr bgcolor="#ffffff" valign="top">
		417	<td>
		418	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('SHADOW, true', SHADOW, true);">SHADOW</a></tt>
		419	</td>
		420	<td>
		421	Tooltip drops a shadow.
		422	Value: true, false
		423	</td>
		424	</tr>
		425	<tr bgcolor="#ffffff" valign="top">
		426	<td>
5787	bpr	427	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('This one drops a shadow (SHADOW command),<br/>and its shadow color has been changed (SHADOWCOLOR command)', PADDING, 8, SHADOW, true, SHADOWCOLOR, '#dd99aa');">SHADOWCOLOR</a></tt>
67	bpr	428	<!--br>
		429
		430	<form>     <select><option>aaa</option><option>bbb</option><option>ccc</option></select></form-->
		431	</td>
		432	<td>
		433	Shadow color.
		434	Value: HTML color, in single quotes.
5787	bpr	435	<br/>Example:
		436	<br/>
67	bpr	437	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', SHADOW, true, SHADOWCOLOR, '#dd99aa')"</font></tt>
		438	</td>
		439	</tr>
		440	<tr bgcolor="#ffffff" valign="top">
		441	<td>
		442	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('Increased shadow width', SHADOW, true, SHADOWWIDTH, 10, PADDING, 8);">SHADOWWIDTH</a></tt>
		443	</td>
		444	<td>
		445	Shadow width (offset).
		446	Value: Integer ≥ 0.
5787	bpr	447	<br/>Example:
		448	<br/>
67	bpr	449	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', SHADOW, true, SHADOWWIDTH, 7)"</font></tt>
		450	</td>
		451	</tr>
		452	<tr bgcolor="#ffffff" valign="top">
		453	<td>
		454	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('STICKY, true<ul><li style=\'font-family:Verdana,Geneva,sans-serif;font-size:8pt;\'><a href=#top>Top of page<\/a><\/li><li style=\'font-family:Verdana,Geneva,sans-serif;font-size:8pt;\'><a href=\'#docu\'>Begin of documentation<\/a><\/li><\/ul>', STICKY, true, CLICKCLOSE, true, PADDING, 6);">STICKY</a></tt>
		455	</td>
		456	<td>
		457	The tooltip stays fixed at its initial position until another tooltip pops up.
		458	Value: true, false.
5787	bpr	459	<br/> <br/>
67	bpr	460	With
5787	bpr	461	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('STICKY, true, DURATION, 2500<br/>This tip is sticky, but its lifetime has been limited to 2.5 seconds.', STICKY, true, CLICKCLOSE, true, DURATION, 2500, WIDTH, 280)">DURATION</a></tt>
67	bpr	462	you can enforce the tooltip to disappear after a certain time span.
		463	</td>
		464	</tr>
		465	<tr bgcolor="#ffffff" valign="top">
		466	<td>
		467	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('The TEXTALIGN command takes as values either \'right\', \'center\', \'justify\' or \'left\', the latter being unnecessary since it is the default value.', WIDTH, 200, TITLE, 'Right-Aligned Text', TEXTALIGN, 'right');">TEXTALIGN</a></tt>
		468	</td>
		469	<td>
		470	Aligns the text in the body of the tooltip.
		471	Value: 'right', 'center',
5787	bpr	472	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('<img align=\'right\' src=\'..\/images\/dragdrop\/muckl.jpg\' width=\'100\' height=\'130\'/>This is some quite lengthy text which demonstrates the justification effect which can be achieved by sending the TEXTALIGN command with the \'justify\' value. Note that text justification is not recommended for text that consists of relatively short lines - as is also the case in this tooltip, in particular with the text alongside the Muckl image above.', TITLE, 'Justified text with Muckl', TEXTALIGN, 'justify', WIDTH, 250);">'justify'</a></tt>
67	bpr	473	or 'left'.
5787	bpr	474	<br/>Example:
		475	<br/>
67	bpr	476	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', TEXTALIGN, 'right')"</font></tt>
		477	</td>
		478	</tr>
		479	<tr bgcolor="#ffffff" valign="top">
		480	<td>
		481	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLE, \'Some title\'', TITLE, 'Some title');">TITLE</a></tt>
		482	</td>
		483	<td>
		484	Display a titlebar.
		485	Value: Text to display, in single quotes.
		486	May even contain HTML, which gives you additional freedom in fashioning the titlebar.
		487	</td>
		488	</tr>
		489	<tr bgcolor="#ffffff" valign="top">
		490	<td>
		491	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('The TITLEALIGN command takes as values either \'right\', \'justify\' or \'left\', the latter being unnecessary since it is the default value.', WIDTH, 240, TITLE, 'Right-Aligned Title', TITLEALIGN, 'right');">TITLEALIGN</a></tt>
		492	</td>
		493	<td>
		494	Aligns the text in the titlebar.
		495	Value: 'right', 'center', 'justify' or 'left'
		496	</td>
		497	</tr>
		498	<tr bgcolor="#ffffff" valign="top">
		499	<td>
		500	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEBGCOLOR, \'#990099\'', TITLE, 'Title background', TITLEBGCOLOR, '#990099');">TITLEBGCOLOR</a></tt>
		501	</td>
		502	<td>
		503	Backgroundcolor of the titlebar.
		504	Value: HTML color, in single quotes.
		505	If it's an empty string <tt>''</tt>,
		506	the border color (see also BORDERCOLOR command) is used (this is the default).
		507	</td>
		508	</tr>
		509	<tr bgcolor="#ffffff" valign="top">
		510	<td>
		511	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEFONTCOLOR, \'#ff6666\'', TITLE, 'Red title', TITLEFONTCOLOR, '#ff6666');">TITLEFONTCOLOR</a></tt>
		512	</td>
		513	<td>
		514	Color of title text.
		515	Value: HTML color, in single quotes.
		516	If it's an empty string <tt>''</tt>, the backgroundcolor of the tooltip body (see also BGCOLOR command) is used (this is the default).
		517	</td>
		518	</tr>
		519	<tr bgcolor="#ffffff" valign="top">
		520	<td>
		521	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEFONTFACE, \'Courier New, Courier, mono\'', TITLE, 'Changed Title Font', TITLEFONTFACE, 'Courier New, Courier, mono');">TITLEFONTFACE</a></tt>
		522	</td>
		523	<td>
		524	Font face for title text.
		525	Value: Like in HTML or CSS. Enclosed with single quotes.
		526	If the value is an empty string <tt>''</tt>, the tooltip body font, in boldified form, is used (this is the default).
5787	bpr	527	<br/>
67	bpr	528	Example:
5787	bpr	529	<br/>
67	bpr	530	<tt><font style="font-size: 12px;" size="2">onmouseover="Tip('Some text', TITLE, 'Some Title', TITLEFONTFACE, 'Verdana,sans-serif')"</font></tt>
5787	bpr	531	<br/>
67	bpr	532	</td>
		533	</tr>
		534	<tr bgcolor="#ffffff" valign="top">
		535	<td>
		536	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('TITLEFONTSIZE, \'18pt\'', TITLE, 'Big Title', TITLEFONTSIZE, '18pt');">TITLEFONTSIZE</a></tt>
		537	</td>
		538	<td>
		539	Font size of title text.
		540	Value: Size with unit, in single quotes.
		541	Unit ('px', 'pt', 'em' etc.) is mandatory.
		542	If the value is an empty string <tt>''</tt>, the fontsize of the tooltip body is applied.
		543	</td>
		544	</tr>
		545	<tr bgcolor="#ffffff" valign="top">
		546	<td>
		547	<tt><a class="nodeco" href="javascript:void(0);" onmouseover="Tip('WIDTH, 200', WIDTH, 200);">WIDTH</a></tt>
		548	</td>
		549	<td>
		550	Width of tooltip.
		551	Value: Integer ≥ 0.
		552	If 0 (the default), the width is automatically adapted to the content of the tooltip.
5787	bpr	553	<br/> <br/>
67	bpr	554	Note that the tooltips follow the W3C box model,
		555	which means that the specified width applies to the actual content of the tooltip,
		556	excluding padding (see PADDING command), border and shadow.
		557	</td>
		558	</tr>
		559	</tbody></table>
		560	</td>
		561	</tr>
		562	</tbody></table>
		563	</td>
5787	bpr	564	<td width="50"><br/></td>
67	bpr	565	</tr>
		566	</tbody></table>
		567

Subversion Repositories wimsdev

(root)/trunk/wims/public_html/scripts/js/tooltip_doc.html @ 5894 – Rev