js文字向上无限循环向上滚动代码

<div class="scroll-container">
    <div class="scroll-content">
        这里是需要向上滚动的文字内容。
    </div>
</div>

.scroll-container {
    width: 100%;
    height: 200px; /* 设置容器高度 */
    overflow: hidden;
    position: relative;
}

.scroll-content {
    position: absolute;
    width: 100%;
    animation: scroll-up 10s linear infinite; /* 应用动画效果 */
}

@keyframes scroll-up {
    from {
        transform: translateY(100%);
    }
    to {
        transform: translateY(-100%);
    }
}

// 如果需要动态添加或更新滚动内容，可以使用以下JavaScript代码
document.addEventListener('DOMContentLoaded', function() {
    const container = document.querySelector('.scroll-container');
    const content = document.querySelector('.scroll-content');
    
    // 示例：定时更新内容
    setInterval(() => {
        content.innerHTML = "新的滚动文字内容。";
    }, 5000); // 每5秒更新一次内容
});