web-dev-qa-db-ja.com

スリックスライダーの矢印を無効にする方法は？

Webページに2つの異なるスタイルのSlickスライダーを使用していますが、矢印に問題があります。手伝ってくれませんか？

これは私のメインの.sliderです。CSSを使用して前の矢印と次の矢印のスタイルを設定しました

http://prntscr.com/7kdpgo

ここでは、Slickの.filteringクラスを使用しましたが、これらの矢印は必要ありません。ここでそれらを無効にして、デザインに追加するにはどうすればよいですか？

http://prntscr.com/7kdq

javascriptjquerysliderarrows
6
Erum-n
<script>
  $('#carouselclass').slick({
     slidesToShow: 3,
     slidesToScroll: 1,
     autoplay: true,
     autoplaySpeed: 1500,
    arrows : false,
  });
</script>
7
user5929999

私が見るところから、スライダーはjsで独自の矢印（私が理解しているものから削除したい矢印）を生成します。ただし、それらにはリンクされた機能があるため、スライダーの上から見たもののように見せてから、上のものをそれらに置き換えます。

$(document).ready(function(){
                $('.your-class-reg').slick({
                   infinite: true,
                   slidesToShow: 1,
                   slidesToScroll: 1,
                   prevArrow: '<a class="your-class-btn-back">Back</a>',
                   nextArrow: '<a class="your-class-btn-forward">Forward</a>',
                   rows: 1
                });
        });

.your-class-btn-backと.your-class-btn-forwardの代わりに、小さな上の矢印に使用したのと同じcssクラスを使用する必要があります。その後、最初に作成したものと重ねて、絶対位置でそれらを移動し、最初のものを読み取ることができます。このようにして、それらは印刷画面の上にあるもののように見え、必要な機能を備えています。

1
DragosB

それらをnullに設定するだけです。仕事は終わりました！

    <script>
      $('#carouselclass').slick({
         slidesToShow: 3,
         slidesToScroll: 1,
         autoplay: true,
         autoplaySpeed: 1500,
         prevArrow: null,
         nextArrow: null,
      });
    </script>
1
Gianluca Ghettini