Cool Carousel左侧菜单导航使用自动滚动,没有延迟

时间:2016-04-01 08:11:25

标签: jquery carousel

我需要将酷旋转木马整合到我的网站上。但我需要使用左右导航激活自动滚动。但是目前当我激活自动滚动功能时没有延迟,然后左右导航被禁用。它不起作用。那么如何在没有延迟的情况下使用自动滚动功能集成左右导航功能。或者建议我使用这个功能的旋转木马。 现在我做了一个代码来完成这个动作强制覆盖,但在那个权利正在工作但左箭头导航不是在woking。我在这里附上我的代码

var $imgWidth1 = $('#carousel1 .car-div').first().outerWidth();
var $imgCount1 = $('#carousel1 .car-div').length;
$('#carousel1').width($imgWidth1*($imgCount1+2));
$('#carousel1').css({'left':-1*$imgWidth1+'px'});//reset the slider so the first image is still visible

$('#next1').click(function(){
    $('#carousel1').stop(true,true); //complete any animation still running - in case anyone's a bit click happy... 
   var $newLeft1 = $('#carousel1').position().left-(1*$imgWidth1);//calculate the new position which is the current position minus the width of one image
   $('#carousel1').animate({'left':$newLeft1+'px'},function(){//slide to the new position...
         if (Math.abs($newLeft1) == (($imgCount1+1)*$imgWidth1)) //...and if the slider is displaying the last image, which is the clone of the first image...
         {
              $('#carousel1').css({'left':-1*$imgWidth1+'px'});//...reset the slider back to the first image without animating 
         }
     });
return false;
});

$('#prev1').click(function(){
     $('#carousel1').stop(); //complete any animation still running  
     var $newLeft1 = $('#carousel1').position().left+(1*$imgWidth1);//calculate the new position which is the current position plus the width of one image
     $('#carousel1').animate({'left':$newLeft1+'px'},function(){//slide to the new position
     if (Math.abs($newLeft1) == (($imgCount1+1)*$imgWidth1)) //if the slider is displaying the first image, which is the clone of the last image
     {
        //alert('hai');
        $('#carousel1').css({'left':-($imgCount1)*$imgWidth1+'px'});//reset the slider back to the last image without animating 
      }
    });
    return false;
});

请参阅以下jsfiddle

https://jsfiddle.net/kichukrishna1201/adkgkfkw/1/

0 个答案:

没有答案