Tooltip showed externally with setTimeout

[kiribati8]

Hi everybody,

I am trying to show tooltip externally, because I want to delay execution of code on server side (getting value of tooltip from database). Delay property of tooltip is not what I need, because server side code is executed immediatly after mouseover and only displaying of tooltip is delayed.

I came up with this solution so far, which works perfectly in Firefox, but not in IE (6 or 7).

<script type="text/javascript">
var timerID = 0;
function showToolTip(tooltip, e, timeout)
{
 if(tooltip != undefined) {
 timerID = setTimeout(function(tooltipObj, evt){tooltipObj.show();}, timeout, tooltip, e);
 }
}

function hideTooltip(tooltip, e)
{
 if(timerID) {
 clearTimeout(timerID);
 timerID = 0;
 }

 if(tooltip != undefined) {
 tooltip.hide(e);
 }
}
</script>

<h:panelGrid
 onmouseover="showToolTip(#{rich:component('tooltipID')}, event, 1000)"
 onmouseout="hideTooltip(#{rich:component('tooltipID')}, event)">
 <h:outputText id="textID" value="#{Bean.textValue}" styleClass="labelLink"/>
</h:panelGrid>
<rich:toolTip
 id="tooltipID"
 mode="ajax"
 layout="block"
 value="#{Bean.tooltipValue}"
 attached="false"/>

Can anyone help please ?

[kiribati8]

So I finally found solutiion. It's working in IE 6 and 7, Firefox 2 and 3, Opera 9. It is not the best solution, but it's working so it is good enough for me :).

Jsp code is the same as above, only javascript has changed:

 var timerID = 0;
 var tooltipObj;
 var tooltipEvent;
 function showToolTip(tooltip, e, timeout)
 {
 tooltipObj = tooltip;
 tooltipEvent = Object.clone(e);

 if(window.event) {
 tooltipEvent = Object.clone(window.event);
 }

 if(tooltip != undefined) {
 timerID = setTimeout('showAfterDelay()', timeout);
 }
 }

 function showAfterDelay()
 {
 tooltipObj.show(tooltipEvent);
 }

 function hideTooltip(tooltip, e)
 {
 if(timerID) {
 clearTimeout(timerID);
 timerID = 0;
 }

 if(tooltip != undefined) {
 tooltip.hide(e);
 }
 }