Positioning hint example

Positioning hint example

Drinks

Name

Type

Min. Consignment

Znamenovskaya aerated *

mineral water

10,000 *

Znamenovskaya natural *

mineral water

25,000 *

Two Oceans *

mineral water

10,000 *

<html>
<head>
<link href="/common_codethat.css" rel="stylesheet" type="text/css">
<script language="javascript1.2" src="codethatsdk.js"></script>
<script language="javascript1.2" src="codethathintpro.js"></script>
<script language="javascript1.2">
<!--
var cthint2_html = "<table width=400 height=200 border=0><tr><td>&nbsp;</td>" +
	"<td align=left valign=middle width=100%><p>" +
	"Znamenovskaya natural water is very rich with useful minerals and microelements." +
	"</p></td><td valign=middle>" +
	"<img src=\"img/Pict0001.jpg\" width=170 height=172></td><td>&nbsp;</td></tr></table>";

var cthint2 = new CT_Hint(400, 250, 1,"", true, 0,300,
	cthint2_html, "#3399FF", "", "",
	{
		width : 2, color : "#003399"
	}, true, 2,"Alpha(Opacity=80) ", 0,400, 0
);

var cthint3_html = "<table width=400 height=200 border=0><tr><td>&nbsp;</td>" +
	"<td align=left valign=middle width=100%><p>" +
	"These remedial and medical-table water is extracted from wells which" +
	" situated in ecological health resort regions of Dnepropetrovsk." +
	"It has the original taste. It is irreplaceable source of health," +
	" good mood and good self feeling.</p></td><td valign=middle>" +
	"<img src=\"img/Pict0005.jpg\" width=155 height=172></td><td>&nbsp;</td></tr></table>";

var cthint3 = new CT_Hint(400, 250, 1,"", true, 0,300,
	cthint3_html, "#3399FF", "", "",
	{
		width : 2, color : "#003399"
	}, true, 2,"Alpha(Opacity=80) ", 0,400, 0
);

var cthint4_html = "<table width=400 height=200 border=0><tr><td>&nbsp;</td>" +
	"<td align=left valign=middle width=100%><p>" +
	"Two Oceans natural mineral water, which is obtained from deep artesian wells," +
	" contains the complex of useful substances and the energy" +
	" of depths of the earth.</p></td><td valign=middle>" +
	"<img src=\"img/2oc.jpg\" width=89 height=172></td><td>&nbsp;</td></tr></table>";

var cthint4 = new CT_Hint(400, 250, 1,"", true, 0,300,
	cthint4_html, "#3399FF", "", "",
	{
		width : 2, color : "#003399"
	}, true, 2,"Alpha(Opacity=80) ", 0,400, 0
);

var cthint5_html = "<p><font color=white>for Countries of SIC</font></p>";
var cthint5 = new CT_Hint(250, 30, 2,"", true, 20,-250,
	cthint5_html, "green", "", "",
	{
		width : 0, color : "black"
	}, true, 2,"", 400, 400, 4000
);

cthint2.create();
cthint3.create();
cthint4.create();
cthint5.create(); 
//-->
</script>
</head>
<body>

	<table width=600 height=200 bgcolor=#FFFFDD border=1 bordercolor=#BBBBBB>
		<tr><th colspan=3 align=center valign=middle>
			<p>Drinks</p>
		</th></tr>
		<tr><th align=center valign=middle>
			<p>Name</p>
		</th>
		<th align=center valign=middle>
			<p>Type</p>
		</th>
		<th align=center valign=middle>
			<p><nobr>Min. Consignment</nobr></p>
		</th></tr>
		<tr><td align=left valign=middle
		  onmouseover="cthint2.show()"
		  onmouseout="cthint2.hide()">
			<p><a href=# onmouseover="cthint2.show()"
			 onmouseout="cthint2.hide()">
			Znamenovskaya <nobr>aerated <font color=#ff0000>*</font></a></nobr></p>
		</td>
		<td align=left valign=middle>
			<p>mineral water</p>
		</td>
		<td align=center valign=middle
		  onmouseover="cthint5.show()"
		  onmouseout="cthint5.hide()">
			<p><nobr><a href=# onmouseover="cthint5.show()"
			 onmouseout="cthint5.hide()">
			10,000 <font color=#ff0000>*</font></a></nobr></p>
		</td></tr>
		<tr><td align=left valign=middle
		  onmouseover="cthint3.show()"
		  onmouseout="cthint3.hide()">
			<p><a href=# onmouseover="cthint3.show()"
			 onmouseout="cthint3.hide()">
			Znamenovskaya <nobr>natural <font color=#ff0000>*</font></a></nobr></p>
		</td>
		<td align=left valign=middle>
			<p>mineral water</p>
		</td>
		<td align=center valign=middle
		  onmouseover="cthint5.show()"
		  onmouseout="cthint5.hide()">
			<p><nobr><a href=# onmouseover="cthint5.show()"
			 onmouseout="cthint5.hide()">
			25,000 <font color=#ff0000>*</font></a></nobr></p>
		</td></tr>
		<tr><td align=left valign=middle
		  onmouseover="cthint4.show()"
		  onmouseout="cthint4.hide()">
			<p><a href=# onmouseover="cthint4.show()"
			 onmouseout="cthint4.hide()">
			Two <nobr>Oceans <font color=#ff0000>*</font></a></nobr></p>
		</td>
		<td align=left valign=middle>
			<p>mineral water</p>
		</td>
		<td align=center valign=middle
		  onmouseover="cthint5.show()"
		  onmouseout="cthint5.hide()">
			<p><nobr><a href=# onmouseover="cthint5.show()"
			 onmouseout="cthint5.hide()">
			10,000 <font color=#ff0000>*</font></a></nobr></p>
		</td></tr>
	</table>
</body>
</html>