ho fatto un tooltip ma non mi fuzniona molto bene, cioe quando passo il mouse sulla parola, mi appare la descrizione ma vorrei che apparisse più vicino alla parola, è possibile farlo?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<!-- Authors: .it -->
<!-- E-mail: com -->
<!-- Copyright: -->
<!-- Script: -->
<head>
<title>Tenua</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Author" content=" - " />
<meta name="keywords" content=" " />
<meta name="description" content="" />
<meta name="Copyright" content="Copyright (c) Your copyright here 2009" />
<link rel="stylesheet" type="text/css" href="stili/grapes.css" />
<link rel="stylesheet" type="text/css" href="stili/style_gallery.css" />
<STYLE type=text/css>.tooltip {
BORDER-RIGHT: #9F73AE 1px dashed;
PADDING-RIGHT: 10px;
BORDER-TOP: #9F73AE 1px dashed;
PADDING-LEFT: 8px;
FONT-SIZE: 8pt;
VISIBILITY: hidden;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
BORDER-LEFT: #9F73AE 1px dashed;
PADDING-TOP: 0px;
BORDER-BOTTOM: #9F73AE 1px dashed;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
POSITION: absolute;
BACKGROUND-COLOR: #D1C9EB;
layer-background-color: #D1C9EB
}
</STYLE>
<script type="text/javascript">
var mouseX = 0;
var mouseY = 0;
if (document.layers)
document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = getCursor;
function getCursor(e) {
if (document.layers) {
mouseX = e.pageX;
mouseY = e.pageY;
}
if (document.all) {
mouseX = event.clientX + document.body.scrollLeft;
mouseY = event.clientY + document.body.scrollTop;
}
return true;
}
function showToolTip(name) {
var tip = getHandle(name);
if (tip.timerID)
clearTimeout(tip.timerID);
tip.left = mouseX;
tip.top = mouseY + 20;
if (document.layers)
tip.visibility = "show";
if (document.all)
tip.visibility = "visible";
tip.timerID = setTimeout("hideToolTip('" + name + "')", 5000);
}
function hideToolTip(name) {
var tip = getHandle(name);
if (tip.timerID)
clearTimeout(tip.timerID);
if (document.layers)
tip.visibility = "hide";
if (document.all)
tip.visibility = "hidden";
}
function getHandle(name) {
if (document.layers)
return(document.layers[name]);
if (document.all) {
var block = eval('document.all.' + name + '.style');
return(block);
}
}
function mmenu(mID) {
var menu = document.getElementById(mID);
var display = menu.style.display;
menu.style.display = (display == "block") ? "none" : "block";
}
window.onload = function() {
var uls = document.getElementsByTagName("ul");
for (i=0;i<uls.length;i++) {
if(uls[i].className=="submenu")uls[i].style.display = "none";
}
}
//-->
</script>
</head>
<body>
<div id="container">
<div id="hdr">
<p align="center">
<img src="images/bottiglie_in_fila.jpg" width="950" height="180" alt="smile" />
</p>
<h1><marquee width="560" scrollamount="1" direction="up" align="middle" height="100" >
<font color="black" size="4" style="font-style:italic; font-family:Calibri"> .</font>
</marquee>
</h1>
<p id="tagline"></p>
</div>
<div id="lftcol">
<ul id="nav">
<li class="menu"><a href="index_pietrapinta.asp" id="current"><font face="Tahoma" size="1" color="yellow">HOME </font></a></li>
<li class="menu"><a href="azienda_pietrapinta.html"><font face="Tahoma" size="1" color="yellow">AZIENDA </font></a></li>
<li class="menu"><a href="territorio_pietrapinta.html"><font face="Tahoma" size="1" color="yellow">TERRITORIO </font></a></li>
<li class="menu"><a href="agriturismo_pietrapinta.html"><font face="Tahoma" size="1" color="yellow">AGRITURISMO </font></a></li>
<li class="menu"><a href="javascript:mmenu('submenu-1')"><font face="Tahoma" size="1" color="yellow">PRODOTTI</a>
<ul class="submenu" id="submenu-1">
</ul>
</li>
</li>
<li class="menu"><a href="javascript:mmenu('submenu-2')"><font face="Tahoma" size="1" color="yellow">CANTINA</a>
<ul class="submenu" id="submenu-2">
<li><a href="#">Vitigni</a></li>
<li><a href="#">Vite</a></li>
</ul>
</li>
<li class="menu"><a href="frantoio_pietrapinta.html"><font face="Tahoma" size="1" color="yellow">FRANTOIO</font></a></li>
<li class="menu"><a href="galleria_pietrapinta.html"><font face="Tahoma" size="1" color="yellow">GALLERIA</font></a></li>
<li class="menu"><a href="dove_siamo_pietrapinta.html"><font face="Tahoma" size="1" color="yellow">DOVE SIAMO</font></a></li>
<li class="menu"><a href="contatti_pietrapinta.html"><font face="Tahoma" size="1" color="yellow">CONTATTI</font></a></li>
</ul>
</li>
</ul>
<br /><br /><br /><br />
<div id="quote">
<p><em>Ta<br />Ve<br />k)<br />T<br /><a href="">i</a></em></p>
</div>
<br /><br /><br /><br /><br /><br /><br /><br />
<!--
<h3>Agriturismo</h3>
<ul>
<li><font color=""></font><a target="_blank" href="http://validator.w3.org/check?uri=referer" rel="nofollow">TERRITORIO</a></li>
<li><a target="_blank" href="http://jigsaw.w3.org/css-validator/check/referer" rel="nofollow">AZIENDA</a></li>
<li><a target="_blank" href="http://www.davereederdesign.com/" rel="nofollow">CANTINA</a></li>
<li><a target="_blank" href="http://www.oswd.org/" rel="nofollow">FRANTOIO</a></li>
<li><a target="_blank" href="http://www.oswd.org/" rel="nofollow">PRODOTTI</a></li>
</ul>
-->
</div>
<div id="rgtcol">
<br />
<h2 style="margin:0px; padding:0px; text-align:left"><i>Prodotti - Vini</i></h2>
<hr />
<br />
<table width="100%">
<tr>
<td valign="top">
<!-- inzio colonna di sinistra -->
<p class="testo">
<img src="images/prodotto_chardonnay.jpg" width=90 border=1 align="left" align="justify" />
<b><font color="yellow" size="2">Chardonnay</b></font><br />
<A HREF="schede/prodotto.chardonnay.pdf" target=" void "><img src="images/PdfSm.gif"> scheda techica </FONT> </A><br />
<b><font color="yellow" face="arial" size="2">Enologia: </b></font> Studio Matura Dr.Attilio Pagli, Dr. Alberto Antonini<br />
<b><font color="yellow" face="arial" size="2">Uve: </b></font> Chardonnay in purezza<br />
<div class="tooltip" id="link1" style="width: 350px">
<b><font color="FORESTGREEN" face="Calibri" size="2">
Colore oro brillante , profumi di mela matura, ananas, frutti esotici e spezie,
dal gusto morbido e sapido, in bocca è pieno di buona struttura, scorre come velluto
regalando piacevoli aromi e un lungo finale. Le uve vengono raccolte a partire dalla fine
di agosto con vendemmia notturna per la salvaguardia degli aromi e dei profumi.
Viene conservato a bassa temperatura fino al momento dell'imbottigliamento,
un 30% fermenta e matura barriques di rovere francese per circa sei mesi prima di
essere aggiunto alla massa. Contenuto alcolico 12,5%. </font></div>
<a onMouseOver="showToolTip('link1')" onMouseOut="hideToolTip('link1')" href="javascript:void(0);">Leggi descrizione</a><br>
</div>
</table>
<table width="100%">
<tr>
<td valign="left">
<p class="testo">
<img src="images/prodotto_chardonnay.jpg" width=90 border=1 align="left" align="justify" />
<b><font color="yellow" size="2">Chardonnay</b></font><br />
<A HREF="schede/prodotto.chardonnay.pdf" target=" void "><img src="images/PdfSm.gif"> scheda techica </FONT> </A><br />
<b><font color="yellow" face="arial" size="2">Enologia: </b></font> Studio Matura Dr.Attilio Pagli, Dr. Alberto Antonini<br />
<b><font color="yellow" face="arial" size="2">Uve: </b></font> Chardonnay in purezza<br />
<div class="tooltip" id="link2" style="width: 450px">
<b><font color="FORESTGREEN" face="Calibri" size="2">
Colore oro brillante , profumi di mela matura, ananas, frutti esotici e spezie,
dal gusto morbido e sapido, in bocca è pieno di buona struttura, scorre come velluto
regalando piacevoli aromi e un lungo finale. Le uve vengono raccolte a partire dalla fine
di agosto con vendemmia notturna per la salvaguardia degli aromi e dei profumi.
Viene conservato a bassa temperatura fino al momento dell'imbottigliamento,
un 30% fermenta e matura barriques di rovere francese per circa sei mesi prima di
essere aggiunto alla massa. Contenuto alcolico 12,5%. </font></div>
<a onMouseOver="showToolTip('link2')" onMouseOut="hideToolTip('link1')" href="javascript:void(0);">Leggi descrizione</a><br>
</div>
</table>
<br />
</div>
<p>
<br /><br /><br /><br />
<br /><br /><br /><br />
<p><span></span><span></span><span></span><span></span><span></span></p>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</div>
<div id="bttmbar">Informativa sulla Privacy <a href="mailto:">Scrivi al webmaster</a></div>
</div>
</body>
</html>
