javascript - 在轮播上添加暂停/播放功能

Question

如何在此轮播上添加播放和暂停功能请帮助我.. 代码在链接下方:

http://jsfiddle.net/P5295/

<div id="carousel">
    <figure>1</figure>
    <figure>2</figure>
    <figure>3</figure>
    <figure>4</figure>
    <figure>5</figure>
    <figure>6</figure>
    <figure>7</figure>
    <figure>8</figure>
    <figure>9</figure>
</div>

Answer 1

添加以下 CSS 以在悬停时暂停。 Here is the demo .

#carousel:hover {
    -webkit-animation-play-state : paused;
    -moz-animation-play-state : paused;
    -o-animation-play-state : paused;
    animation-play-state : paused;
}

Try this example如果您想使用按钮暂停。在这种情况下，唯一的问题是按钮必须在轮播旁边。

如果您希望您的按钮位于旋转木马旁边的其他任何地方，那么您必须使用 JS/jQuery like this .

如果你想暂停和恢复使用按钮点击，try this example

如果你想要 2 个停止和启动按钮，try this one