CODEWITHSUNDEEP
htmlcsshyperlinkaccordion
Sowmya
Sowmya

Reputation: 26989

Accordion link affecting the child anchor links

Below is the link for the code demo

Fiddle here

There are 2 questions

  1. Click on the links of the first accordion I(Link1 | Link 2 | Link 3), why is that acting weird
  2. And the sub-child div in the 1st accordion content is not visible in the output. (<div>This div is not visible in the output</div>)

Thanks in advance.

Upvotes: 0

Views: 115

Answers (3)

Sanober Malik
Sanober Malik

Reputation: 2805

Well as Tugkan said all the links are affected by $('.accordion a').click(function(){ that's why it is behaving strange and as far as the division is concerned the property display none is applied to it see in the inspect element.

Do something like this to make division appear :

Demo

style="display:block;"

Upvotes: 0

sandeep
sandeep

Reputation: 92853

Write like this:

$('.accordion > li > a').click(function(){
        $(this).next().slideToggle("fast");
        $(this).closest('li').toggleClass('active');
    });

Define class name to the DIV instead of .accordion div{display:none}. Write like this:

.accordion .extended{display:none;}

Check this http://jsfiddle.net/zkZN6/2/

Upvotes: 1

Tugkan
Tugkan

Reputation: 183

the reason is that you defined $('.accordion a').click(function(){ in your javascript which affects all tags under the class name called "accordion". you need to define another classname just specific for the "accr1,accr2,accr3...etc" and define another javascript for them.

Upvotes: 0

Related Questions