初心者向けに現職Webエンジニアがデザイン、コーディング、ディレクションについて解説。

mogaBlog

Web コーディング

【bxslider】ページャーの丸を非表示にする方法

投稿日:2020年1月7日 更新日:

ページャーの丸を非表示にする方法
スライダーを実装しようとして簡単に設置できるプラグインを入れますよね。
いれたもののこの部分いらないといったことよくありますよね。
今回はbxsliderの機能の一つで設置したスライダーの数によって増えていく
丸い部分の消し方について解説してきます。

以前書いた記事でいろいろなオプションあることがわかります。
オプションを使って好きなようにカスタマイズできます。

誰でも簡単スライドショー!「bxslider」の設置方法【jQuery】

丸を非表示にする方法

まず通常のスクリプトは下記になります。

$(function() {
  $('.slider').bxSlider();
});

丸を消した記述は下記になります。

$(function() {
  $('.slider').bxSlider({
    pager: false /* 追加部分 */
  });
});



デモ

実際に設置したものはコチラになります。
demo

pagerのところを「false」とすることで丸の部分を非表示にすることができます。
これで今回の目標の丸の部分が非表示になりました。

また、いろいろなカスタマイズのやり方がありますので随時記事を書いていきますね。
ではまた。

この記事を書いた人

moga

moga

歴14年のフロントエンジニア。HTML/CSSはもちろん、JavaScriptも得意。主に初心者コーダー向けに記事を書いています。

Ads



-Web, コーディング

Copyright© mogaBlog , 2021 All Rights Reserved Powered by STINGER.