Forum Moderators: not2easy

Message Too Old, No Replies

Mouseover problem

         

gwillow

5:02 pm on Jan 11, 2008 (gmt 0)

10+ Year Member



I am having the hardest time with displaying a pop up window when mousing over a calendar day.

The following code works for a basic link within the body...

div#pop span {display: none;}

div#pop a:hover span {display: block;
position: absolute; top: 500px; left: 650px; width: 125px;
padding: 5px; margin: 10px; z-index: 100;
color: #fff; background: #323B4A;
font: 13px "Trebuchet MS", Arial, Helvetica, sans-serif; text-align: center;}

<div id="links">
<a href="#">15<span>WPSA Snow Cross Hill City </span></a>
</div>

But like I said, I cannot get this to work properly within a table. I am using the following code which uses PHP and MySQL to load the table entries...

td.pop span {display: none;}

td.pop a:hover span {display: block;
position: absolute; top: 500px; left: 650px; width: 125px;
padding: 5px; margin: 10px; z-index: 100;
color: #fff; background: #323B4A;
font: 13px "Trebuchet MS", Arial, Helvetica, sans-serif; text-align: center;}

<td class='pop' align='center' valign='middle' height='20px'><font color='red'><a href='index.php#calendar'>". ($i - $startday + 1) . "</a><span>WPSA Snow Cross Hill City</span></font></td>

It does partially work though. The <span> text is not displaying as it should. I just cannot get the mouseover effect to work.

Any ideas?

Gregg

swa66

4:38 pm on Jan 14, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



the <span> isn't inside the <a> tag (but it's after it).
Hence your html has nothing ito match the css selector
td a:hover span

the display:none is working cause you don;t include the "a" tag there in the selector.

gwillow

9:28 pm on Jan 14, 2008 (gmt 0)

10+ Year Member



swa66,

Thank you for the find. Made my day!