2020-04-01

幻灯片轮播图

$(fuction()){

  var $li = $('.slide_pics li');

  var len = $li.length;

  var nextli = 0;

  var nowli = 0;

  var $prev = $('.prev');

  var $next = $('.next');

  var timer = null;

  $li.not(':first').css({left:800});

  $li.each(function(index)){

  var $sli = $('

');

  if(index == 0){

    $sli.addClass('active');

    }

    $sli.appendTo('.points');

    })

    $points = $('.poinnts li');

    $points.click(function()){

    nextli = $(this).index

    if(nextli == nowli){

    return;

    }

    move();

    $(this).addClass('active').siblings().renoveClass('active');

    });

    $prev.click(function()){

    nextli--;

    move();

    $points.eq(nextli).addClass('active').siblings().removeClass('actve');

    });

    $next.click(function()){

    nextli--;

    move();

    $points.eq(nextli).addClass('active').siblings().removeClass('actve');

    });

    $('.slide').hover(function()){

    clearInterval(timer);

    },function(){

    timer = setInterval(autoplay,3000);

    });

    timer = setInterval(autoplay,3000);

    function autoplay(){

      nextli++;

      move();

    $points.eq(nextli).addClass('active').siblings().removeClass('actve');

    }

    function move(){

    if(nextli < 0){

    nextli = len - 1;

    nowli = 0;

    $li.eq(nextli).css({left:-800});

    $li.eq(nowli).stop().stop().animate({left:400});

    $li.eq(nowli).stop().stop().animate({left:0});

    nowli = nextli;

    return;

    }

    if(nextli > len - 1){

    nextli = 0;

    nowli = len - 1;

    $li.eq(nextli).css({left:-800});

    $li.eq(nowli).stop().stop().animate({left:400});

    $li.eq(nowli).stop().stop().animate({left:0});

    nowli = nextli;

    return;

    }

    if(nextli > nowli){

    $li.eq(nextli).css({left:600});

    $li.eq(nowli).stop().animate({left: 800});

    }else{

    $li.eq(nextli).css({left: -800});

    $li.eq(nowli).stop().animate({left: 800});

    }

    $li.eq(nextli).stop().animate({left: 0});

    nowli = nextli;

    }

    })