<!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>
