jq循环轮番纵向滚动，并且有动画效果，附上完整代码

以下是一个使用jq实现循环轮番纵向滚动并带动画效果的例子，你可以根据自己的需求进行修改：

HTML代码：

<div class="scroll-container">
  <div class="scroll-items">
    <div class="scroll-item">这是第一个滚动项</div>
    <div class="scroll-item">这是第二个滚动项</div>
    <div class="scroll-item">这是第三个滚动项</div>
    <div class="scroll-item">这是第四个滚动项</div>
  </div>
</div>

CSS代码：

.scroll-container {
  height: 100px;
  overflow: hidden;
}

.scroll-items {
  animation: scroll 10s linear infinite;
}

.scroll-item {
  height: 50px;
  line-height: 50px;
}

@keyframes scroll {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-200px);
  }
}

jQuery代码：

$(function() {
  var $scrollContainer = $('.scroll-container');
  var $scrollItems = $('.scroll-items');
  var $scrollItem = $('.scroll-item');
  var itemHeight = $scrollItem.outerHeight(true);
  var moveDistance = 0;
  var currentTop = 0;

  setInterval(function() {
    $scrollItems.animate({
      top: currentTop - itemHeight
    }, 500, function() {
      $scrollItems.append($scrollItems.children().first());
      $scrollItems.css('top', currentTop);
    });
  }, 2000);
});

解释一下上面的代码：

- 首先，我们需要设置一个容器（scroll-container）来包含滚动项（scroll-item），使用CSS的overflow属性来隐藏滚动项的超出部分。
- 我们还需要一个滚动项的容器（scroll-items），并通过CSS的animation属性来实现滚动效果。
- 在jQuery代码中，我们定义了一些变量，包括容器（$scrollContainer）、滚动项容器（$scrollItems）、滚动项（$scrollItem）、每个滚动项的高度（itemHeight）、移动距离（moveDistance）和当前顶部位置（currentTop）。
- 我们使用setInterval函数来定时执行滚动动画，每2秒钟执行一次，通过animate函数来实现滚动动画，将滚动项容器的top属性向上移动一个滚动项的高度，并在动画完成后将第一个滚动项添加到滚动项容器的最后面，同时将滚动项容器的top属性重置为当前顶部位置。

希望这个例子能够帮助你实现你的需求。