AJFMEDIA
AJFMEDIA

Reputation: 2123

targeting li on hover but not parent li

I have a dynamically generated list that has potentially up to about 5 levels. I want the listed item text to underline when I hover over the listed item, however not the parent li.

see example.

http://jsfiddle.net/ca7fL/5/

you see when you hover on "this", the above parent li, underlines aswell.

Any ideas?

Cheers

Upvotes: 5

Views: 1151

Answers (3)

Clément
Clément

Reputation: 12927

That seems hard to achieve, since when you point the child li element you're also effectively pointing its parent.

There is a solution, though: add a span tag to your menu items, and make that tag hoverable: http://jsfiddle.net/ca7fL/16/

Upvotes: 7

HBublitz
HBublitz

Reputation: 680

Maybe you need to apply css classes to LI - Elements when geenerating them, so you can style them explicitly. CSS itself seems to be insufficient here.

Upvotes: 0

Marius
Marius

Reputation: 58921

ul li ul { padding-left:20px}
ul li ul li:hover { text-decoration:underline; curor:pointer;}

Upvotes: -1

Related Questions