如何在 cycle2.js 中悬停图像时显示两个 prev/next 按钮

Question

我想在 cycle2.js 中悬停图像时同时显示 prev/next 按钮。

这是link供大家参考http://jquery.malsup.com/cycle2/demo/prevnext.php

<div class="cycle-slideshow" 
data-cycle-fx=scrollHorz
data-cycle-timeout=0
>
<!-- prev/next links -->
<div class="cycle-prev"></div>
<div class="cycle-next"></div>
<img src="http://malsup.github.io/images/p1.jpg">
<img src="http://malsup.github.io/images/p2.jpg">
<img src="http://malsup.github.io/images/p3.jpg">
<img src="http://malsup.github.io/images/p4.jpg">
</div>

Answer 1

应该这样做：

$(function () {
    $(".cycle-prev, .cycle-next").css("opacity", "0");

    $(".cycle-slideshow").hover(function () {
        $(".cycle-prev, .cycle-next").css("opacity", ".7");
    }, function () {
        $(".cycle-prev, .cycle-next").css("opacity", "0");
    });
});