Question

我试图在jQuery中创建一个代码，将活动的类添加到下一个div并将其从前一个div中删除，反之亦然。这一切都考虑到了我想稍后添加的动画。

如果您想使用HTML和CSS查看代码： http://codepen.io/salman15/pen/kXVmRG?editors=1010

$(document).ready(function() {
    $('#next').click(function() {
        var location = $(this).parent().parent();
        $('.active').removeClass('active');
        $('div').next('#case').addClass('active');
    });

    $('#prev').click(function() {
        var location = $(this).parent().parent();
        $('.active').removeClass('active');
        $(this).prev('#case').removeClass('active');
    });
});

Answer 1

//file
 $(document).ready(function(){

  $('.d1 li.s1').click(function(){
   $('li').removeClass("active");
  $(this).addClass("active");
  });
  $('ul.ddd li.ggg').click(function(){
    $('li').removeClass("active");
    $(this).addClass("active");
});
 $(".next").click(function(){
 i=1
            var $toHighlight = $('.active').next().length > 0 ? $('.active').next() : $('#MainMenu li.s1').first();
            $('.active').removeClass('active');
            $toHighlight.addClass('active');
            });


         $(".previous").click(function(){
            var $toHighlight = $('.active').prev().length > 0 ? $('.active').prev() : $('ul.mainmenu1 li.s1').last(); 

            $('.active').removeClass('active');
            $toHighlight.addClass('active');
        });
});

Answer 2

$('.ggg').click(function(){
   $('.ggg,.sss').removeClass("active");
  $(this).addClass("active");
  $(this).next();
  });

 var x22 = $( "#MainMenu" ).find( ".ggg" ).length;
 //alert(x22);

 var i = 118;
    var hrefa2;
      $(".previous").click(function () {

      hrefa = $( "#MainMenu").find(".ggg").eq(i).attr("alt");
       //hrefa3 = $("#MainMenu").find(".ggg").eq(0);
     i--;
    //alert(hrefa);
     $('.ggg').removeClass("active");
    $( "#MainMenu" ).find( ".ggg" ).eq(i).addClass("active");
 });

  var i = 0;
    var hrefa;
      $(".next").click(function () {

      hrefa = $( "#MainMenu").find(".ggg").eq(i).attr("alt");
      //hrefa1 = $("#MainMenu").find(".ggg").eq(0);
     i++;
    //alert(hrefa);
     $('.ggg').removeClass("active");
    $( "#MainMenu" ).find( ".ggg" ).eq(i).addClass("active");
 });

上一个和下一个按钮来改变div

2 个答案: