<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>滚动测试</title>
<script src="https://code.jquery.com/jquery-3.7.0.min.js" crossorigin="anonymous"></script>
</head>
<body>
<div class="dvScroll" style="height:210px;overflow-y: hidden;">
<div class="list_item">1测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">2测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">3测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">4测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">5测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">6测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">7测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">8测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">9测试文字测试文字测试文字测试文字测试文字测试文字</div>
<div class="list_item">10测试文字测试文字测试文字测试文字测试文字测试文</div>
<div class="list_item">11测试文字测试文字测试文字测试文字测试文字测试文</div>
<div class="list_item">12测试文字测试文字测试文字测试文字测试文字测试文</div>
<div class="list_item">13测试文字测试文字测试文字测试文字测试文字测试文</div>
<div class="list_item">14测试文字测试文字测试文字测试文字测试文字测试文</div>
<div class="list_item">15测试文字测试文字测试文字测试文字测试文字测试文</div>
</div>
</body>
<script>
$(function () {
setInterval(function () {
scroll($(".dvScroll"), 5)
}, 2000);
})
//数据滚动
function scroll(parent, maxCount) {
var children = $(parent).children()
if (children.length > maxCount) {
var first = $(children).first();
var height = first.height()
first.animate({
height: 0
}, 500, function () {
$(parent).append(first.css('height', height))
});
}
}
</script>
</html>
