Hello,
I am working in a page with about 6 pieces of text in a table. Inside I have a link where a visitor clicks on to see an image. When I use the default onmouseover event, it works perfectly and each different link they hover, the tooltip uses that location where the mouse is. However, when I use an onclick event and use a return false to make sure I can use anchors like # (I need to show the hand icon), the tooltip pops up where on the area where I clicked the onclick event earlier.
This is what I use:
<tr>
<td><a href="#" onclick="return false"><span class="tooltip" a onclick="tooltip.pop(this, '#1', { smartPosition:true, position:3 })"> Foto's </span></a> <div style="display:none;"> <div id="1"> <b>TEXT</b><br /><br /> <img src="/image1.jpg" style="float:right;" /></div> </div></td>
<td align="right">Aansluitpunt wandcontactdoos</td>
<td>Aansluitpunt wandcontactdoos B</td>
<td><a href="#" onclick="return false"><span class="tooltip" a onclick="tooltip.pop(this, '#2', { smartPosition:false, position:1 })"> Foto's</a> </span> <div style="display:none;"> <div id="2"> <b>TEXT</b><br /><br /> <img src="/image2.jpg" style="float:right;" /></div> </div></td>
</tr>
So if I click on event in #1, then it shows on that location and when I then click on #2, the tooltip pops up where I earlier clicked on #1.
Please advice, as we're in the process for purchasing the license and I can not show it like this.
I'm more than happy to disclose the URL via private communciation due to NDA's.
Thank you.
Your code contains syntax errors.
<a href="#" onclick="return false"><span class="tooltip" a onclick="tooltip.pop(this, '#2', { smartPosition:false, position:1 })"> Foto's</a> </span>
should be:
<a href="#" onclick="return false"><span class="tooltip" onclick="tooltip.pop(this, '#2', { smartPosition:false, position:1 }); return false;"> Foto's </span></a>