caroufredsel に 2 つのリンクを配置して、カルーセルにカーソルを合わせたときにオンとオフを切り替えましたが、すばやくカーソルを合わせると、カルーセルに入った回数に応じて、リンクが点滅し続けます。mouseenter/leave イベントがそれほど急速に発生しないようにする方法はありますか?
プラグインには独自のタイプのボタンが付属していることは知っていますが、スプライトを使用しており、その作成方法がわかりません。
これに使用した短い jQuery コードを次に示します。
$('#prev, #next').hide();
$('.image_carousel').mouseenter(function() {
$('#prev, #next').show("slow");
});
$('.image_carousel').mouseleave(function() {
$('#prev, #next').hide("slow");
});`
そしてhtml:
<div class="image_carousel">
<div id="carousel">
carousel items...
</div>
<a class="prev" id="prev" href="#"><i class="icon-angle-left icon-4x"></i></a>
<a class="next" id="next" href="#"><i class="icon-angle-right icon-4x"></i></a>
</div>
Chrome DevTools では、不透明度が 1 に設定され、デクリメント、オーバーフロー (非表示、幅、パディング、高さ、マージン) など、2 つのアンカー タグにさまざまなスタイルが付加されていることがわかります。これらは、マウスが出入りするたびに与えられています。