在没有任何插件的jquery中可滚动,旋转木马,滑块 - 最简单的方法

   <div class="scroll-content">

       <!-- 内容 -->

   </div>

   width: 300px;

   overflow: hidden;

   width: 600px;

   position: relative;

   var container = $('.scroll-container');

   var content = $('.scroll-content');

   var distance = content.width() - container.width();

   function scroll() {

       content.animate({left: -distance}, 5000, 'linear', function() {

           content.css('left', 0);

           scroll();

       });

   }

   scroll();

   <div class="carousel-item">项目1</div>

   <div class="carousel-item">项目2</div>

   <div class="carousel-item">项目3</div>

   <!-- 更多项目 -->

   width: 300px;

   height: 200px;

   position: relative;

   perspective: 1000px;

   width: 200px;

   height: 150px;

   position: absolute;

   top: 25px;

   left: 50px;

   transform-style: preserve-3d;

   var container = $('.carousel-container');

   var items = $('.carousel-item');

   var angle = 360 / items.length;

   var radius = Math.round((container.width() / 2) / Math.tan(Math.PI / items.length));

   items.each(function(index) {

       var rotateY = angle * index;

       var translateZ = -radius;

       $(this).css({

           'transform': 'rotateY(' + rotateY + 'deg) translateZ(' + translateZ + 'px)'

       });

   });

   <div class="slider-item">滑块1</div>

   <div class="slider-item">滑块2</div>

   <div class="slider-item">滑块3</div>

   <!-- 更多滑块 -->

   width: 300px;

   overflow: hidden;

   width: 100px;

   height: 100px;

   float: left;

   var container = $('.slider-container');

   var items = $('.slider-item');

   var distance = items.width();

   function slide() {

       items.animate({left: -distance}, 1000, 'linear', function() {

           items.css('left', 0);

           slide();

       });

   }

   slide();