javascript - Add PlusMinus to Accordion Menu -
my accordion menu has counter count submenus. want change plus minus. if there submenu "plus" should add if closed, if opened minus.
if there no submenu nothing should added.
the counter code
$('#cssmenu > ul > li ul').each(function(index, e){ var count = $(e).find('li').length; var content = '<span class="cnt">' + count + '</span>'; $(e).closest('li').children('a').append(content); });
well achieve first getting 2 icons 1. plus 2. minus , putting in css:
#cssmenu > ul > li.has-sub > span { background: url(images/icon_plus.png) 90% center no-repeat; } #cssmenu > ul > li.has-sub.active > span { background: url(images/icon_minus.png) 90% center no-repeat; }
here menu follows:
<div id="cssmenu"> <ul> <li><a href="#"><span>products</span></a> <ul> <li><a href="#">widgets</a></li> <li><a href="#">menus</a></li> <li><a href="#">products</a></li> </ul> </li> </ul> </div>
now jquery check if menu has submenu using:
$('#cssmenu > ul > li:has(ul)').addclass("has-sub");
and add 2 css classes made , drop down using jquery. made jfiddle put here.
here go jfiddle - accordian plus minus
hope helps! not of code mine. cheers!
Comments
Post a Comment