web-dev-qa-db-ja.com

Flexsliderカスタム次/前のボタン

選択したカスタムHTML要素を挿入し、それらに「次へ」または「前へ」ボタン機能を割り当てるなど、カスタマイズが非常に簡単であることが好きだったので、以前はjQueryCycleプラグインを使用していました。

Flexsliderでこれを行う方法が見つかりませんが、カスタムページ付けのオプションしか表示されません。例えば。 manualControls。

Flexsliderでこれを行う方法を知っている人はいますか？例えば。画像またはアンカーを「次へ」ボタンとして設定します。

cssslidercarouselflexslider
10
pealo86

このようなものはどうですか：

$('.slider').flexslider({
    directionNav: false,
    controlNav: false
})

$('.prev').on('click', function(){
    $('.slider').flexslider('prev');
    return false;
})

$('.next').on('click', function(){
    $('.slider').flexslider('next');
    return false;
})

デモ

または、2回書きたくない場合は、次のようにすることもできます。

$('.slider').flexslider({
    directionNav: false,
    controlNav: false
})

$('.prev, .next').on('click', function(){
    var href = $(this).attr('href');
    $('.slider').flexslider(href);
    return false;
})

デモv2

28
drip