如何為類內的 Div 類和 ID 創建懸停效果

Question

我正在嘗試創建類似於 flexslider 默認按鈕的下一個/上一個按鈕。

但我想使用 div 和類來做到這一點。

小提琴在這里

我的標記如下所示：

<div class="dirnav">
    <div id="next"> Next </div>
    <div id="prev" > Prev </div>
</div>

1. 默認情況下，箭頭必須是不可見的。
2. 當懸停.dirnav ，箭頭必須從左右進入。

我怎樣才能做到這一點 ？

[編輯：JSFIDDLE 鏈接已更新]

Answer 1

為元素添加此代碼

.dirnav {overflow: hidden;}
#next {margin-left: -30px;}
#prev {margin-right: -30px;}
.dirnav:hover #prev,
.dirnav:hover #next{margin: 0;}