Here's what I'd do:

<table width="800" border="0" cellpadding="0" cellspacing="0" id="navtop">
<tr align="center">
<td> 
<cfoutput query="SportsMenu"> 
<a href="/catalogue.cfm?sportID=#sportsMenu.sportID#&clubID=0" <cfif
url.sportID eq sportsMenu.sportID>class="active"</cfif>>
<cfif session.SportID is sportsmenu.sportID>
<!--- Style 1 --->
#SportsMenu.Sport#
<cfelse>
<!--- style 2 --->
#SportsMenu.Sport#
</cfif>
</a>
</cfoutput>
</td>
</tr>
</table>


Notice the adding of the <cfif url.sportID eq
sportsMenu.sportID>class="active"</cfif> to the link.

Here's your new css:

#navtop {
        color: #E0249A;
}
#navtop a {
        color: #DC008A;
        line-height: 30px;
        padding-right: 10px;
        padding-left: 10px;
        text-decoration: none;
        font-size: 14px;
}
#navtop a:hover {
        color: #FFFFFF;
}
#navtop a.active {
        /* styles for active link */
}
#navtop a.active:hover {
        /* hover styles for active link */
}

Hope that helps!
_____ 

Jake Churchill 
Team Leader
11204 Davenport, Ste. 100
Omaha, NE  68154 
http://www.cfwebtools.com 
402-408-3733 x103 

-----Original Message-----
From: Jenny Gavin-Wear [mailto:[EMAIL PROTECTED] 
Sent: Wednesday, February 13, 2008 9:06 PM
To: CF-Talk
Subject: "Dynamic" CSS problem

Hi,

I'm trying to do a bit of "dynamic-ish" css.  In the following code I need
to be able to change the appearance of the link to highlight the currently
selected menu option.

I've tried putting spans and divs around an item, but that does nothing.
I've tried ID and Class, still nothing.  I'm sure I'm doing something
obviously stupid, but what?

Thanks in advance, J

<table width="800" border="0" cellpadding="0" cellspacing="0" id="navtop">
<tr align="center">
<td>
<cfoutput query="SportsMenu">
<a href="/catalogue.cfm?sportID=#sportsMenu.sportID#&clubID=0">
<cfif session.SportID is sportsmenu.sportID>
<!--- Style 1 --->
#SportsMenu.Sport#
<cfelse>
<!--- style 2 --->
#SportsMenu.Sport#</cfif></a></cfoutput>
</td>
</tr>
</table>

>From my stylesheet:
#navtop {
        color: #E0249A;
}
#navtop a {
        color: #DC008A;
        line-height: 30px;
        padding-right: 10px;
        padding-left: 10px;
        text-decoration: none;
        font-size: 14px;
}
#navtop a:hover {
        color: #FFFFFF;
}






~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to 
date
Get the Free Trial
http://ad.doubleclick.net/clk;160198600;22374440;w

Archive: 
http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:298952
Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm
Unsubscribe: 
http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4

Reply via email to