Solved

Jquery simple accordion using a list

Posted on 2011-09-08
22
379 Views
Last Modified: 2012-05-12
Hi,

I am trying to create a simple jQuery accordion using the code here: http://jsfiddle.net/nhDxH/

The biggest issue I am having is adding/removing the class when I select an item. I can get the lists to hide/show. Any suggestions?

I would like to set the active class on the LI

Thanks,

Ryan
0
Comment
  • 11
  • 9
22 Comments
 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
Your css is not showing there.
By the way, which class you want to add and remove and on which event
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
Updated my CSS via the link, sorry!

I am trying to add ".active" to li.active

And on the click event.
0
 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
<<I am trying to add ".active" to li.active>>

You mean to say that if you already have a class active on li, you want to add it again?
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
No I was writing out that the ".active" is being attached to a LI tag. On click of A add class "active" to the parent LI
0
 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
And css is still not there!! :)
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
Ah, hit run instead of update, try it out now! http://jsfiddle.net/nhDxH/1/

Thanks.
0
 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
i have done some updation, please check.

Please let me know what exactly is the requirement
0
 
LVL 1

Accepted Solution

by:
catonthecouchproductions earned 500 total points
Comment Utility
Close! Can you get the "active" class on to attach to the LI tag on click?
0
 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
check now
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
I still see the class being added to the <a> not the <li>

If its easier we can have the click event on the <li> so:

$('.ski_category').click(function() {
0
Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
check again, now only adding to parent li
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
I think fiddle is adding new links for each revision can you send me the copy you're working on?
0
 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
Awesome! thank you.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
I've requested that this question be closed as follows:

Accepted answer: 0 points for catonthecouchproductions's comment http:/Q_27297912.html#36504033

for the following reason:

Speedy and patient!
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
Can we reverse this? I clicked the wrong comment and didnt mean to flag it. This question was perfect and the expert helped me with that I needed. If we can reopen and I can award points, please.

Thanks,

Ryan
0
 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
why no point for me??
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
No i did! It was a mistake, clicked the wrong button :) clicked my own. You should be good now.
0
 
LVL 1

Author Comment

by:catonthecouchproductions
Comment Utility
One quick thing I just noticed! http://jsfiddle.net/nhDxH/7/ - click one of the child elements in side the list. the active gets added to that as well. It should have just been that parent LI
0
 
LVL 40

Expert Comment

by:gurvinder372
Comment Utility
<< Close! Can you get the "active" class on to attach to the LI tag on click?>>
In this comment #36503912, you mentioned that you want the active to be attached to li tag on click.
0

Featured Post

What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

Join & Write a Comment

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
Viewers will learn one way to get user input in Java. Introduce the Scanner object: Declare the variable that stores the user input: An example prompting the user for input: Methods you need to invoke in order to properly get  user input:
The viewer will learn how to dynamically set the form action using jQuery.

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now