marquee标签滚动一个接一个图
时间: 2023-07-01 14:12:49 浏览: 83
如果你想要让多张图片一个接一个地滚动,可以通过使用JavaScript来实现。基本上,你需要通过JavaScript动态地添加多个img标签到HTML文档中,然后使用marquee标签来滚动这些标签。示例代码如下:
```HTML
<div id="marquee-container">
<marquee behavior="scroll" direction="left">
<span id="image-container"></span>
</marquee>
</div>
```
```JavaScript
var images = [
"image1.jpg",
"image2.jpg",
"image3.jpg"
];
var imageContainer = document.getElementById("image-container");
for (var i = 0; i < images.length; i++) {
var img = document.createElement("img");
img.src = images[i];
img.width = 200;
img.height = 150;
imageContainer.appendChild(img);
}
```
在这个例子中,我们首先创建了一个包含marquee标签的容器div,并在其中添加了一个span标签作为图片容器。然后,在JavaScript中,我们创建了一个包含多个图片URL的数组,然后动态地创建了多个img标签,并将它们添加到了span标签中。最后,我们将span标签添加到了marquee标签中,并设置了滚动方向为左侧。这样,我们就可以实现一个接一个地滚动多张图片的效果了。
阅读全文