切换图像以展开全部并折叠全部

我试图交换所有崩溃的图像并在点击上扩展所有但我真的没有得到它请任何人帮助我…提前感谢

这里是样本的链接http://www.ornusweb.com/showcase/checking/collapsible-menu.html一切正常,除了我们点击它的展开全部折叠所有按钮。 它应该交换图像

请帮我 !!!

这是css

body { font: 10pt Arial, Helvetica, Sans-serif; } a { text-decoration: none; } #example1, #example2, #example3, #example4, #example5 { float: left; } .expand_all{ cursor: pointer; } .collapse_all { cursor: pointer; } .example_menu { font-size: 90%; list-style: none; margin: 0; padding: 0; vertical-align: top; width: 624px; } .example_menu ul { display: none; list-style: none; padding: 0; } #menu1, #menu2, #menu3, #menu4, #menu5 { margin: 0; } #menu1 li, #menu2 li, #menu3 li, #menu4 li, #menu5 li, .example_menu li { background-image: none; margin: 0; padding-bottom: 1px; } .example_menu ul ul { display: block; } .example_menu ul ul li a { padding-left: 20px; width: 109px; } .example_menu a { color: #000; cursor: pointer; display: block; font-weight: bold; margin-left: 0; padding: 10px 2px 2px 17px; width: 605px; height: 24px; } .example_menu a.expanded { background: #E8E8E8 url('images/minusimg1.png') no-repeat 592px 50%; } .example_menu a.collapsed { background: #E8E8E8 url('images/plusimg1.png') no-repeat 592px 50%; } .example_menu a:hover { text-decoration: none; } .example_menu ul a { background: #e8e8e8; border-top: 2px solid #fff; color: #000; display: block; font-weight: normal; padding: 2px 2px 2px 10px; width: 119px; } .example_menu ul a:link { font-weight: normal; } .example_menu ul a:hover { background : #f5f5f5; text-decoration: underline; } .example_menu li.active a { background: #fff; } .example_menu li.active li a { background: #e8e8e8; } #menu1 li.footer, #menu2 li.footer, #menu3 li.footer, #menu4 li.footer, #menu5 li.footer, .example_menu .footer { background: transparent url('images/footer.jpg') no-repeat 0 0; border-top: 2px solid #fff; height: 9px; line-height: 15px; margin: 0 0 10px 0; width: 131px; } .example_menu .footer span { display: none; } /* nadeem css */ .newstyles{ font: 20px/18px arial;color: #0B0B0C;margin: 5px 0px 20px 5px;} .newstyles li{ height: 32px;font: bold 12px/32px arial;color: #0B0B0C;} .newstyline{clear: both;height: 1px;background-color: #E6E6E6;width: 100%;margin: 1px 0px 3px 0px;} } 

这是js

 $(document).ready(function() { setTimeout(function() { // Slide $('#menu1 > li > a.expanded + ul').slideToggle('medium'); $('#menu1 > li > a').click(function() { $(this).toggleClass('expanded').toggleClass('collapsed').parent().find('> ul').slideToggle('medium'); }); $('#example1 .expand_all').click(function() { $('#menu1 > li > a.collapsed').addClass('expanded').removeClass('collapsed').parent().find('> ul').slideDown('medium'); }); $('#example1 .collapse_all').click(function() { $('#menu1 > li > a.expanded').addClass('collapsed').removeClass('expanded').parent().find('> ul').slideUp('medium'); }); }, 250); }); 

这是html

 

猜测它是顶部的两个图像,你可以这样做:

  

简单地隐藏不相关的……虽然没有真正交换图像。