Styling A:active

152 Posts

mDesign Reply #1, 18 years, 1 month ago

Hi there

I got the same problem as in this topic: http://modxcms.com/forums/index.php/topic,11572.0.html (I made a new one because of the age of the topic).

My css part:

 #lmenu li.active a {
	 background:  #eaeaea;
	 color:  #D9391F;
	 border-left:  8px solid #D9391F;
;
}

The call for the styling for my wayfinder:

<div id="lmenu">
<h2 class="hide">Menu:</h2>
<ul>
<li>[[Wayfinder? &startId=`0` &activelink=`active` &rowTpl=`LnavMenu`]]</li>
</ul>
</div>

The complete markup and everything is working, except for the active part. When I hover a link and then click it, the actual page (active) should be the same as the hover but it jumps back to just a:link sad

How come it doesn’t work? Are the ID’s or Properties not well set or something?

Cheers again tongue

mDesign

(cool site coming up soon now laugh

)

Quality doesn't need a big signature.

MODX Staff
1,535 Posts

Garry Nutting Reply #2, 18 years, 1 month ago

What does your LnavMenu row template look like?

Garry Nutting
Senior Developer
MODX, LLC

Email: [email protected]
Twitter: @garryn
Web: modx.com

152 Posts

mDesign Reply #3, 18 years, 1 month ago

Quote from: garryn at Oct 01, 2008, 09:30 AM

What does your LnavMenu row template look like?

I think you mean this:

Chunk:
Name: LnavMenu
Code: <a class="lmenu" href="[+wf.link+]">[+wf.linktext+]</a>

Quality doesn't need a big signature.

MODX Staff
1,535 Posts

Garry Nutting Reply #4, 18 years, 1 month ago

Try changing your CSS to:

 #lmenu li a.active {
	 background:  #eaeaea;
	 color:  #D9391F;
	 border-left:  8px solid #D9391F;
}

And, your row template to:

<a [+wf.classes+] href="[+wf.link+]">[+wf.linktext+]</a>

You see, the other thing I’m not sure is if you want all your menu items to be part of a single <li> element. If you wanted separate <li> elements for each link, then you need to move the <li></li> into the row template as well.

Garry Nutting
Senior Developer
MODX, LLC

Email: [email protected]
Twitter: @garryn
Web: modx.com

152 Posts

mDesign Reply #5, 18 years, 1 month ago

You see, the other thing I'm not sure is if you want all your menu items to be part of a single <li> element. If you wanted separate <li> elements for each link, then you need to move the <li></li> into the row template as well.

I don’t get this part but you first two fixes did the trick

thnx. No it actually stays activated woohoo grin

Quality doesn't need a big signature.

152 Posts

mDesign Reply #6, 18 years, 1 month ago

Okay I get what you meant about the <li> stuff now tongue

Thanks for that, the outcome is really going to be great: http://www.mdbzone.nl/mmphotography/

Quality doesn't need a big signature.