Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/413.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript jQuery滑块没有';t旋转_Javascript_Jquery - Fatal编程技术网

Javascript jQuery滑块没有';t旋转

Javascript jQuery滑块没有';t旋转,javascript,jquery,Javascript,Jquery,我在我的网站上有一个滑动旋转器,但它不会自动旋转框中的项目-导航工作并旋转,但我希望它在我进入网站后自动旋转。 这是我的js: $(document).ready(function() { var nbr = 0; $('.slider').each(function() { var slider = $(this); //get width and height of the wrapper and give it to the UL var wrap

我在我的网站上有一个滑动旋转器,但它不会自动旋转框中的项目-导航工作并旋转,但我希望它在我进入网站后自动旋转。 这是我的js:

$(document).ready(function() {

   var nbr = 0;
   $('.slider').each(function() {
      var slider = $(this);

   //get width and height of the wrapper and give it to the UL
    var wrapperwidth = $(slider).width() *  $(slider).find('ul > li').size();
    $(slider).find('ul').css('width', wrapperwidth);
    var wrapperheight = $(slider).height();
    $(slider).find('ul').css('height', wrapperheight);


   //set my li width
    var width = $(slider).width();
    $(slider).find('ul li').css('width', width);

   //set my counter vars
    var counter = $(slider).find('ul > li').size();
    var decount = 1;
    var autocount = 1;

      if (counter > 1) {
      //create my number navigation
        var createNum = 1;
         $(slider).after('<ul class="numbers"><li></li></ul>');
        var numbers = $(slider).parent().find('.numbers');
         $(numbers).find('li:first-child').html(createNum+'_'+nbr).addClass('activenum').attr('id', 'id1_'+nbr);
        while ( createNum != counter) {
            createNum++;
           $(numbers).append("<li id='id"+createNum+"_"+nbr+"'>"+createNum+"_"+nbr+"</li>");
        }

      //get my number-width (number navigation should always be centered)
        var numwidth = $(slider).find('.numbers li:first-child').width() * $(slider).find('.numbers li').size();
        $(slider).find('.numbers').css('width', numwidth);
      }

      nbr++;
   });



   //make the number clickable
   $(".numbers li").click(function() {
      var slider = $(this).closest('.sliderWrapper');
      var slider0 = $(slider).find('.slider');
    var clickednum = $(this).html().split('_')[0] * - $(slider0).width() + $(slider0).width();
    $(slider0).find('ul').animate({ left: clickednum }, 400, 'swing', function() { });
    $(slider).find('.activenum').removeClass('activenum');
    $(this).addClass('activenum');
    decount = $(this).html();
   });



   rotateSwitch = function(sliderW, speed) {
      var sliderWrap = sliderW;
      play = setInterval(function() {
         var nextNum = parseInt($($(sliderWrap).find(".numbers li.activenum")).html().split('_')[0])+1;
         if (nextNum > $(sliderWrap).find(".numbers li").length) {
            nextNum = 1;
         }
         //console.log("nextnum: "+nextNum+", numbers length: "+$(sliderWrap).find(".numbers li").length);
         $(sliderWrap).find(".numbers li").each(function() {
            if( parseInt($(this).html().split('_')[0]) == nextNum )
               $(this).click();
         });
      }, speed);
   };

   makeAutoSlide = function(sliderWrap, speed) {
      if ($(sliderWrap).length > 0 && $(sliderWrap).find(".numbers li").length > 1) {
         rotateSwitch(sliderWrap, speed);

         $(sliderWrap).find(".slider li").hover(function() {
            if ($(sliderWrap).find(".numbers li").length > 1) {
               clearInterval(play); //Stop the rotation
            }
        }, function() {
           if ($(sliderWrap).find(".numbers li").length > 1) {
               rotateSwitch(sliderWrap, speed); //Resume rotation timer
           }
        });
      }
   };


});
$(文档).ready(函数(){
var-nbr=0;
$('.slider')。每个(函数(){
变量滑块=$(此);
//获取包装的宽度和高度,并将其交给UL
var wrapperwidth=$(滑块).width()*$(滑块).find('ul>li').size();
$(滑块).find('ul').css('width',wrapperwidth);
var wrapperheight=$(滑块).height();
$(滑块).find('ul').css('height',wrapperheight);
//设置我的li宽度
变量宽度=$(滑块).width();
$(滑块).find('ul li').css('width',width);
//设置我的计数器变量
变量计数器=$(滑块).find('ul>li').size();
var-decount=1;
var自动计数=1;
如果(计数器>1){
//创建我的号码导航
var createNum=1;
$(滑块)。之后(“
    • ”); var numbers=$(slider.parent().find('.numbers'); $(数字).find('li:first child').html(createNum+''.+nbr).addClass('activenum').attr('id','id1'+nbr)); while(createNum!=计数器){ createNum++; $(数字)。追加(“
    • “+createNum+”“+nbr+”
    • ”; } //获取我的数字宽度(数字导航应始终居中) var numwidth=$(滑块).find('.numbers li:first child').width()*$(滑块).find('.numbers li').size(); $(滑块).find('.numbers').css('width',numwidth); } 丁腈橡胶++; }); //使数字可点击 $(“.numbers li”)。单击(函数(){ var slider=$(this).closest('.sliderrapper'); var slider0=$(slider.find('.slider'); var clickednum=$(this.html().split(“”“)[0]*-$(slider0.width()+$(slider0.width()); $(slider0).find('ul').animate({left:clickednum},400,'swing',function(){}); $(滑块).find('.activenum').removeClass('activenum'); $(this.addClass('activenum'); decount=$(this.html(); }); 旋转开关=功能(滑块、速度){ var sliderRap=滑块; play=setInterval(函数(){ var nextNum=parseInt($($(sliderRap).find(“.numbers li.activenum”)).html().split(“”“)[0])+1; if(nextNum>$(sliderWrap.find(“.number”).length){ nextNum=1; } //log(“nextnum:+nextnum+”,数字长度:“+$(sliderrap.find(.numbers li”).length); $(SliderRap).find(“.number”).each(function(){ if(parseInt($(this).html().split(“”“')[0])==nextNum) $(此选项)。单击(); }); },速度); }; makeAutoSlide=功能(滑块、速度){ if($(sliderrap.length>0&$(sliderrap.find(“.number”).length>1){ 旋转开关(滑块、速度); $(SliderRap).find(“.slider li”).hover(函数(){ 如果($(SliderRap).find(“.numbers”).length>1){ clearInterval(播放);//停止旋转 } },函数(){ 如果($(SliderRap).find(“.numbers”).length>1){ 旋转开关(滑块,速度);//恢复旋转计时器 } }); } }; });
我不确定这是setInterval和clearInterval的问题,还是我写错了什么

我将代码放在JSFIDLE中,因此您知道该结构的外观。

谢谢你的帮助。
干杯

小提琴没有重现问题。请尝试共享一个有效的代码来重现您的问题这就是为什么我写的FIDLE只用于HTML结构,基本上这个旋转器用于CMS,所以有很多行包含CMS命令,所以这不起作用。我想知道的是,如果我在这个js中写错了什么,或者clearinterval和setinterval被错误地使用了,你在哪里调用
makeAutoSlide()
函数?如果你不调用自动旋转函数,你就无法实现它。事实上,没有oO。我应该叫它在哪里?在文件的末尾。准备好了<代码>$(文档).ready(函数(){[…所有代码….]makeAutoSlide();})