滑块溢出响应

Question

我正在使用这个滑块，所有的工程很好，但为什么在小屏幕 （小于480）或响应视图它不运行？！ 我该如何解决这个问题？

在小提琴的更多细节如下

http://jsfiddle.net/roXon/tMxp5/1/

$(function() { 
    var c = 1, 
     timeOut, 
     fit, 
     isStopped = false, 
     boxw = $('.box').outerWidth(true), 
     boxh = $('.box').outerHeight(true), 
     boxn = $('.box').length; 

    $('#slider').width(boxw*boxn); 
    $('#gal, #slider').height(boxh); 
    ////////////////////////////////// 
    function measure() { 
     var winw = $(window).width(); 
     fit = Math.ceil(winw/boxw)-1; // math ceil -1 to get the number of COMPLETELY visible boxes 
     $('#gal').width(winw); 

     $('#t').html('Boxw='+boxw+' Boxh='+boxh+' Winw='+winw+' VisibleBoxes='+ fit); 
    } 
    measure(); 

    $(window).resize(function() { 
     measure(); 
    }); 
    //////////////////////////////////  
    function b(){ 
     cc = (c === 1) ? $('.prev').hide() : $('.prev').show(); 
     ccc =(c >= boxn/fit) ? $('.next').hide() : $('.next').show();  
    }  
    $('.btn').hide(); 
    ///////////////////////////////// 

    function a(cb){ 
     $('#slider').animate({left: '-'+ (boxw*fit)*(c-1) },800, cb); 
    } 
    //////////////////////////////// 
    function auto() { 
    if(isStopped){ return }; 
     clearTimeout(timeOut); 
     timeOut = setTimeout(function() { 
     $('.btn').hide();    
     c++;    
     if (c >= (boxn/fit)+1) { 
      c = 1; 
     }    
      a(function(){ 
      auto(); 
      }); 
     }, 2000); 
    } 
    auto(); 
    ///////////////////////////////////////////////////////////////// 
     $('.next').click(function() { 
      c++; 
      b(); 
      a(); 
     }); 
     $('.prev').click(function() { 
      c--; 
      b(); 
      a(); 
     }); 
    ///////////////////////////////////////////////////////////////// 
    $('#gal').bind('mouseenter mouseleave', function(e) {  
     (e.type === 'mouseenter') ? 
     (isStopped=true, b(), clearTimeout(timeOut)) : 
     (isStopped=false, auto()); 
    }); 

}); 

谢谢

Answer 1

这是因为你的测量功能设置的可见箱数为0

尝试改变测量功能到：

function measure() { 
    var winw = $(window).width(); 
    fit = Math.ceil(winw/boxw)-1; // math ceil -1 to get the number of COMPLETELY visible boxes 
    $('#gal').width(winw); 

    if (fit == 0) fit = 1; 
    $('#t').html('Boxw='+boxw+' Boxh='+boxh+' Winw='+winw+' VisibleBoxes='+ fit); 
} 

它应该解决您的问题：http://jsfiddle.net/tMxp5/270/