Wednesday, 15 February 2012

How to remove end of breadcrumb with CSS / jQuery -



How to remove end of breadcrumb with CSS / jQuery -

i tried up, everywhere find question asked, html code much different , didn't apply problem.

we using ready made e-commerce platform, renders out breadcrumbs in next matter:

[jsfiddle][http://jsfiddle.net/fvhjg/1/]

i still need rid of lastly raquo there (after "suljetut" in case.)

i have managed hide origin element , lastly crumb (a link links same page, stupid). ones left actual categories , "home" of course. have remove lastly raquo (last-child) opposed 4th (nth-child) in case. right raquo gets removed everytime, because product 2 categories deep, , 5 categoeries deep , on.

can please guide me in right direction? if it's possible css great, , i'm trying consider jquery lastly alternative if it's not possible css.

ps. cannot alter how html code renders out in way, no classes/ids can inserted (well jquery can of course).

woah, list crazy. there's no need have many lists within lists:

<ul> <li> <a href="#">link 1</a> <span class="breadcrumb">x</span> </li> <li> <a href="#">link 2</a> <span class="breadcrumb">x</span> </li> <li> <a href="#">link 3</a> <span class="breadcrumb">x</span> </li> <li> <a href="#">link 4</a> <span class="breadcrumb">x</span> </li> </ul>

this how you'd remove lastly breadcrumb:

ul li:last-child .breadcrumb { display:none; }

jsfiddle example.

if in illustration there ever going 4 links (no more, no less), can this:

ul > li > ul > li > ul > li > ul > li .breadcrumbseparator { display:none; }

but that's hardly ideal. otherwise jquery you'd have loop through pull deepest breadcrumb , remove (see select deepest kid in jquery).

css breadcrumbs

No comments:

Post a Comment