Toggling list image and expand all jquery accordion w/ unordered lists

Posted by Evan on Stack Overflow See other posts from Stack Overflow or by Evan
Published on 2011-01-08T05:20:52Z Indexed on 2011/01/08 5:53 UTC
Read the original article Hit count: 367

Filed under:
|
|
|

I have a functioning jquery accordion using pure unordered lists. I'm trying to incorporate 2 pieces of functionality.

Here is my functioning accordion code and a demo of it working. http://jsbin.com/itibi4/

  1. Toggling Arrows.

i'm tring to get the parent bullets to be a toggling arrow and point down when clicked while the child bullets stay as bullets instead of an arrow. Would I be able to get some help with this?

.inactive { 
background-image:url("http://img547.imageshack.us/img547/4103/arrowp.gif");
background-position:4px -31px;
background-repeat:no-repeat;
cursor:pointer;
padding-left:20px;
padding-top:10px;
}

.active {
background-image: url("http://img547.imageshack.us/img547/4103/arrowp.gif");
background-position: 4px 12px;
background-repeat:no-repeat;
font-weight:bold;
}
  1. Expand All / Collapse All

also, i'm trying to incorporate an expand all / collapse all functionality. this is code to the same demo the code is from a previous project, which i've added below the unordered list menu, but i'm having difficulty incorporating it into this project. Would I be able to get some help with this?

$('.swap').click(function()

          {
            if($(this).text() == 'Click to Collapse All FAQs')
            {
              $('ul.menu').slideUp('normal');
              $('ul.menu li a').removeClass('active');
              $(this).text($(this).text() == 'Click to Expand All FAQs' ? 'Click to Collapse All FAQs' : 'Click to Expand All FAQs');
            }
            else
            {
              $('ul.menu').slideDown('normal');
              $('ul.menu li a').addClass('active');
              $(this).text($(this).text() == 'Click to Expand All FAQs' ? 'Click to Collapse All FAQs' : 'Click to Expand All FAQs');
            }
          }

Thank you so much for your help!

Evan

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about accordion