How to apply active mode in jquery accordian
Hi All,
I am using an jquery accordian as a menu in my site...it goes on next page when i click on the button but i want to show an that button in active state when it on is on its respective page.
Below mentioned code is i am using for my accordion menu.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('#accordion > li').hover(
function () {
var $this = $(this);
$this.stop().animate({'width':'340px'},500);
$('.heading',$this).stop(true,true).fadeOut();
$('.heading_strength',$this).stop(true,true).fadeOut();
$('.heading_weight',$this).stop(true,true).fadeOut();
$('.heading_energy',$this).stop(true,true).fadeOut();
$('.heading_muscle',$this).stop(true,true).fadeOut();
$('.heading_core',$this).stop(true,true).fadeOut();
$('.heading_flex',$this).stop(true,true).fadeOut();
$('.heading_boxing',$this).stop(true,true).fadeOut();
$('.heading_events',$this).stop(true,true).fadeOut();
$('.bgDescription',$this).stop(true,true).slideDown(500);
$('.description',$this).stop(true,true).fadeIn();
},
function () {
var $this = $(this);
$this.stop().animate({'width':'70px'},500);
$('.heading',$this).stop(true,true).fadeIn();
$('.heading_strength',$this).stop(true,true).fadeIn();
$('.heading_weight',$this).stop(true,true).fadeIn();
$('.heading_energy',$this).stop(true,true).fadeIn();
$('.heading_muscle',$this).stop(true,true).fadeIn();
$('.heading_core',$this).stop(true,true).fadeIn();
$('.heading_flex',$this).stop(true,true).fadeIn();
$('.heading_boxing',$this).stop(true,true).fadeIn();
$('.heading_events',$this).stop(true,true).fadeIn();
$('.description',$this).stop(true,true).fadeOut(500);
$('.bgDescription',$this).stop(true,true).slideUp(700);
}
);
});
</script>
Please let me know with the solution with this issue.
Thank you.