tooltip ajax problema stampa

[Sara_stella]

Ciao a tutti,
ho utilizzato uno script utilissimo per far comparire un tooltip al passaggio del mouse sopra un'immagine con link.
Il problema è che in fase di stampa il tolltip è visibile e si posiziona sopra l'immagine.
Come posso evitarlo?

Il codice che ho utilizzato è questo:

<style type="text/css">

#dhtmlgoodies_tooltip{
background-color:#EEE;
border:1px solid #000;
position:absolute;
display:none;
z-index:20000;
padding:2px;
font-size:0.9em;
-moz-border-radius:6px; /* Rounded edges in Firefox */
font-family: "Trebuchet MS", "Lucida Sans Unicode", Arial, sans-serif;

}
#dhtmlgoodies_tooltipShadow{
position:absolute;
background-color:#555;
display:none;
z-index:10000;
opacity:0.7;
filter:alpha(opacity=70);
-khtml-opacity: 0.7;
-moz-opacity: 0.7;
-moz-border-radius:6px; /* Rounded edges in Firefox */
}
</style>
<SCRIPT type="text/javascript">
/************************************************** ************************************************** ********
(C) www.dhtmlgoodies.com, October 2005

This is a script from www.dhtmlgoodies.com. You will find this and a lot of other scripts at our website.

Updated:
March, 11th, 2006 - Fixed positioning of tooltip when displayed near the right edge of the browser.
April, 6th 2006, Using iframe in IE in order to make the tooltip cover select boxes.

Terms of use:
You are free to use this script as long as the copyright message is kept intact. However, you may not
redistribute, sell or repost it without our permission.

Thank you!

www.dhtmlgoodies.com
Alf Magne Kalleland

************************************************** ************************************************** ********/
var dhtmlgoodies_tooltip = false;
var dhtmlgoodies_tooltipShadow = false;
var dhtmlgoodies_shadowSize = 4;
var dhtmlgoodies_tooltipMaxWidth = 200;
var dhtmlgoodies_tooltipMinWidth = 100;
var dhtmlgoodies_iframe = false;
var tooltip_is_msie = (navigator.userAgent.indexOf('MSIE')>=0 && navigator.userAgent.indexOf('opera')==-1 && document.all)?true:false;
function showTooltip(e,tooltipTxt)
{

var bodyWidth = Math.max(document.body.clientWidth,document.docume ntElement.clientWidth) - 20;

if(!dhtmlgoodies_tooltip){
dhtmlgoodies_tooltip = document.createElement('DIV');
dhtmlgoodies_tooltip.id = 'dhtmlgoodies_tooltip';
dhtmlgoodies_tooltipShadow = document.createElement('DIV');
dhtmlgoodies_tooltipShadow.id = 'dhtmlgoodies_tooltipShadow';

document.body.appendChild(dhtmlgoodies_tooltip);
document.body.appendChild(dhtmlgoodies_tooltipShad ow);

if(tooltip_is_msie){
dhtmlgoodies_iframe = document.createElement('IFRAME');
dhtmlgoodies_iframe.frameborder='5';
dhtmlgoodies_iframe.style.backgroundColor='#FFFFFF ';
dhtmlgoodies_iframe.src = '#';
dhtmlgoodies_iframe.style.zIndex = 100;
dhtmlgoodies_iframe.style.position = 'absolute';
document.body.appendChild(dhtmlgoodies_iframe);
}

}

dhtmlgoodies_tooltip.style.display='block';
dhtmlgoodies_tooltipShadow.style.display='block';
if(tooltip_is_msie)dhtmlgoodies_iframe.style.displ ay='block';

var st = Math.max(document.body.scrollTop,document.document Element.scrollTop);

var leftPos = e.clientX + 10;

dhtmlgoodies_tooltip.style.width = null; // Reset style width if it's set
dhtmlgoodies_tooltip.innerHTML = tooltipTxt;
dhtmlgoodies_tooltip.style.left = leftPos + 'px';
dhtmlgoodies_tooltip.style.top = e.clientY + 10 + st + 'px';


dhtmlgoodies_tooltipShadow.style.left = leftPos + dhtmlgoodies_shadowSize + 'px';
dhtmlgoodies_tooltipShadow.style.top = e.clientY + 10 + st + dhtmlgoodies_shadowSize + 'px';

if(dhtmlgoodies_tooltip.offsetWidth>dhtmlgoodies_t ooltipMaxWidth){ /* Exceeding max width of tooltip ? */
dhtmlgoodies_tooltip.style.width = dhtmlgoodies_tooltipMaxWidth + 'px';
}

var tooltipWidth = dhtmlgoodies_tooltip.offsetWidth;
if(tooltipWidth<dhtmlgoodies_tooltipMinWidth)toolt ipWidth = dhtmlgoodies_tooltipMinWidth;


dhtmlgoodies_tooltip.style.width = tooltipWidth + 'px';
dhtmlgoodies_tooltipShadow.style.width = dhtmlgoodies_tooltip.offsetWidth + 'px';
dhtmlgoodies_tooltipShadow.style.height = dhtmlgoodies_tooltip.offsetHeight + 'px';

if((leftPos + tooltipWidth)>bodyWidth){
dhtmlgoodies_tooltip.style.left = (dhtmlgoodies_tooltipShadow.style.left.replace('px ','') - ((leftPos + tooltipWidth)-bodyWidth)) + 'px';
dhtmlgoodies_tooltipShadow.style.left = (dhtmlgoodies_tooltipShadow.style.left.replace('px ','') - ((leftPos + tooltipWidth)-bodyWidth) + dhtmlgoodies_shadowSize) + 'px';
}

if(tooltip_is_msie){
dhtmlgoodies_iframe.style.left = dhtmlgoodies_tooltip.style.left;
dhtmlgoodies_iframe.style.top = dhtmlgoodies_tooltip.style.top;
dhtmlgoodies_iframe.style.width = dhtmlgoodies_tooltip.offsetWidth + 'px';
dhtmlgoodies_iframe.style.height = dhtmlgoodies_tooltip.offsetHeight + 'px';

}

}

function hideTooltip()
{
dhtmlgoodies_tooltip.style.display='none';
dhtmlgoodies_tooltipShadow.style.display='none';
if(tooltip_is_msie)dhtmlgoodies_iframe.style.displ ay='none';
}

</SCRIPT>


E nel link ho questo:

...

Grazie

[Sara_stella]

risolto il problema, ho utilizzato i css invece di ajax:

<STYLE>
A {
COLOR: #000d88;
TEXT-DECORATION: none
}

A:visited {
COLOR: #1b589c;
}

A:hover {
COLOR: #d44700;
BORDER-BOTTOM: #d44700 1px solid;
}

A.info {
POSITION: relative
}
A.info SPAN.tt {
DISPLAY: none
}
A.info:hover SPAN.tt {
DISPLAY: block
}
A.info:hover SPAN.tt {
BORDER-RIGHT: #000 1px solid;
PADDING-RIGHT: 6px;
BORDER-TOP: #000 1px solid;
PADDING-LEFT: 6px;
LEFT: 2em;
PADDING-BOTTOM: 6px;
BORDER-LEFT: #000 1px solid;
WIDTH: 30em;
COLOR: #000;
PADDING-TOP: 6px;
BORDER-BOTTOM: #000 1px solid;
POSITION: absolute;
TOP: 2em;
BACKGROUND-COLOR: #f8f8cb;
TEXT-ALIGN: left
}
</STYLE>

E nel link:

[img]immagine.jpg[/img]<SPAN class=tt>testo tooltip</SPAN>