网页设计中常常需要用到名单滚动的效果，比如推荐列表、新闻滚动等。HTML可以通过CSS和JavaScript实现此类滚动效果，下面介绍一种HTML名单滚动代码。
<html>
<head>
<style type="text/css">
#list {
width: 200px;
height: 80px;
overflow: auto;
border: 1px solid gray;
}
</style>
<script type="text/javascript">
var items = ["Item1","Item2","Item3","Item4","Item5"];
var index = 0;
function scrollList() {
document.getElementById("list").innerHTML = items[index];
index++;
if(index == items.length) {
index = 0;
}
setTimeout("scrollList()",2000);
}
</script>
</head>
<body onload="scrollList()">
<div id="list"></div>
</body>
</html>
代码解析：
- 首先在<style>标签中设置了包含名单的<div>元素的宽度、高度和边框样式，并将滚动属性设置为“auto”，表示当超出容器大小时自动滚动。
- 接着在<script>标签中定义了一个数组“items”，其中包含了需要滚动的项目列表。
- 然后定义了一个名为“scrollList()”的JavaScript函数，该函数通过“index”变量依次输出每个项目，当输出到最后一个项目时将“index”重置为0。
- 最后在<body>标签中添加<div>元素，并通过“onload”事件调用“scrollList()”函数，以启动名单滚动效果。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
