Response title
This is preview!
Hey there,
I have an issue in my jquery script. I did menu with button navigation under it. The problem is : when I click on About item on the menu and then I click on the next button I'm not in the good item menu.
For example, if I click on About item and then on the next button I should be on Contact item but it's not the case.
This is my fiddle link : http://jsfiddle.net/jarod51/drQ79/4/
- <div id="cssmenu">
- <ul id="list">
- <li class='active'><a id="testSlide1" href='#'><span>Home</span></a></li>
- <li><a id="testSlide2" href='#'><span>Products</span></a></li>
- <li><a id="testSlide3" href='#'><span>About</span></a></li>
- <li><a id="testSlide4" href='#'><span>Contact</span></a></li>
- </ul>
- </div>
- <nav class="da-arrows">
- <button id="PrevButton">Previous</button>
- <button id="NextButton">Next</button>
- </nav>
- $("a").click(function(){
- // If this isn't already active
- if (!$(this).parent().hasClass("active")) {
- // Remove the class from anything that is active
- $("li.active").removeClass("active");
- // And make this active
- $(this).parent().addClass("active");
- }
- });
- $('a').click(function(e){
- e.stopPropagation();
- });
- var list = $("#list");
- var li = list.children();
- var lengthMinusOne = li.length - 1;
- var index = 0;
- var num = $("#list li").length;
- var prevLi = $(li[0]);
- $("#NextButton").click(function(){
- index++;
- if (index > lengthMinusOne) index = 0;
- prevLi.removeClass("active");
- prevLi = $(li[index]).addClass("active");
- });
- $("#PrevButton").click(function(){
- index--;
- if (index < 0) index = lengthMinusOne;
- prevLi.removeClass("active");
- prevLi = $(li[index]).addClass("active");
- });
1
!