Using multiple accordion in jquery with single function

()

I was working on an application recently and i had to use accordion in multiple places and pages. Of-course this was a extra space and time. So, i came up with an idea to make my own accordion in
jQuery which can be called any time with help a single function.This could not be a complete solution, but certainly has re usability.
Today I will be sharing this knowledge with you all and hope it would be helpful.

First create a function pass two variables to the function. first parameter is link field with which we click to toggle , second parameter is the division which opens and closes data. rest is a simple logic as you can see.Note that parameter are nothing but your div ID’s.

var Toggled=false; 
$(document).ready(function() {
  function custom_accordion(linker,changer)
  {
    $('#'+linker).click(function(){
      if(Toggled==false)
      {
        $('#'+linker).html("Hide");
        $("#"+changer).fadeIn(100); 
        Toggled=true;
      }
      else
      {
        $('#'+linker).html("Change");
        $("#"+changer).fadeOut(100);    
        Toggled=false;
      }
      return false;
    });
  }
});

Call this for each page and forget manual coding to check if you need to place accordion or not..

Hit Like if this article was useful to you!

Average rating / 5. Vote count:

No votes so far! Be the first to rate this post.

As you found this post useful...

Follow us on social media!

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?

Leave a Reply

Your email address will not be published. Required fields are marked *