Question

我正在尝试使div可水平滚动这是一个html示例：

     <div class="container">
      <div class="wrapper">
        <div class="grid grid-wr">
          <h1>Products We Offer</h1><hr>
          <div class="product-slide">
            <button id="arrows" class="next">&#8250;</button>
              <img class="product" src="" alt="">
              <img class="product" src="" alt="">
              <img class="product" src="" alt="">
              <img class="product" src="" alt="">
              <img class="product" src="" alt="">
              <img class="product" src="" alt="">
            <button id="arrows" class="prev">&#8249;</button>
          </div>
        </div>
      </div>
    </div>

我找到了答案here

            var currentIdx = 0;
            jQuery.easing.def = "easeInOutQuad";
                $(".next").click(function (){

                    //$(this).animate(function(){
                        $('.product-slide').animate({
                            scrollLeft: $(".product").eq(currentIdx).offset().left
                             }, 600);
                        currentIdx++;
                    //});
                });

但是我不能正常工作我想逐个滚动项目，接下来的5个或者其他什么？增量不起作用当我把固定距离ex：+ = 400px它工作正常，我真的卡住了

使div可水平滚动

0 个答案: