如何修改css以显示滑块文本

Question

多个CSS字幕动画：http://jsfiddle.net/2nnao6m6/1/

单一动画：http://jsfiddle.net/nu4paxft/

HTML：

<div id="sample3" lang="is">

        <figure>
            <img src="olafsfjordur.png" width="200" height="200" alt="Ólafsfjörður" />
            <figcaption>Ólafsfjörður</figcaption>
        </figure>

    <!--end sample3--></div>

如何修改多个css动画，使滑块文本与单个动画的位置相同。

Answer 1

很简单：

.mainHolder figure:hover figcaption {
    left: -70px;
    bottom: 40px;
}

演示： http://jsfiddle.net/2nnao6m6/2/

如果要将值进一步放入或放出，请更改值。