Question

CSS3制作的滑块有很多例子，但几乎所有滑块都需要点击触发来更改幻灯片。我想知道是否可以制作一个自动滑块，它可以连续无限地更改幻灯片。

例如，将结构视为

<div class="parent">
    <div class="child">
       First DIV
    </div>
    <div class="child">
       Second DIV
    </div>
    <div class="child">
       Third DIV
    </div>
</div>

使用CSS

.parent {
    width: 100px;
    height: 100px;
    overflow: hidden;
}
.child {
    width: 100%;
    height: 100%;
    float: left;
}

我们可以继续滚动child框架内的parent元素吗？

Answer 1

正如你的建议，我应该回答而不是评论，所以在这里，你可以参考这里的来源 - http://css3.bradshawenterprises.com/cfimg/，它使用CSS3动画来交换图像。

虽然我建议您使用jQuery或JS而不是CSS3动画，因为跨浏览器支持，尤其是涉及IE时。

Answer 2

你问的是纯CSS3吗？那么这就是你要找的东西：

CSS3 image slider

带有纯CSS3的无限图像滑块

2 个答案: