PDA

View Full Version : Can anyone help me with this?



delic
06-06-2008, 10:29 PM
1) Script Title: Rich HTML Balloon Tooltip

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex5/balloontooltip.htm

3) Describe problem: Hi everyone, thank you advance for any and all assistance...

Now then, I am trying to use this script on my site to add a small tooltip on top of links and I'm running into a problem I cannot figure out.

1) The tooltip is appearing on the FARRRRRR right side of the browser completely outside of the Div it should be housed in...it's also nowhere near the link that is activating it.

Can anyone help me on this? I think it's something small that I am over looking, but I can't seem to figure it out..

Thanks!

Minos
06-07-2008, 02:34 AM
Any chance you have a link of the site in action? Makes it easier to to troubleshoot.

delic
06-09-2008, 06:41 PM
Sorry...it's local at the moment...anything I can do to help you help me?

=)

boogyman
06-09-2008, 06:59 PM
post your code using

tags

delic
06-09-2008, 09:16 PM
Hope this helps....thanks guys!!





<table>
<tr>
<th colspan="3"><h2>River North Location</h2></th>
</tr>
<tr>
<th class="cellcolor" colspan="3"><h2>Monday</h2>8 weeks, starting May 5th</th>
</tr>
<tr>
<td width="48">6:00 P.M.</td>
<td width="148"><a href="" rel="atango2">Argentine Tango II</a><br />
<div id="atango2" class="balloonstyle">
<img src="images/tangocouple.gif" alt="Tango Couple" style="float:left; margin-right: 8px; border:1px solid black" /><b>Argentine Tango II</b> We will start exploring some improvisation because this dance doesn't have the same reliance on formal structure like many other dances. Course content will continue to add new elements, and focus on developing more variety in the use of the basic elements.</div>
Prereq: Argentine Tango Fundamentals<br />
Instructor: Kelly</td>
<td width="186"></td>
</tr>

delic
06-10-2008, 01:58 AM
.balloonstyle{
position:absolute;
top: -500px;
left: 0;
padding: 5px;
visibility: hidden;
border:1px solid black;
font:10px Arial, Helvetica, sans-serif;
line-height: 15px;
z-index: 100;
background-color: #fbc45a;
width: 300px;
}

#arrowhead{
z-index: 99;
position:absolute;
top: -500px;
left: 0;
visibility: hidden;
}