bxSliderのオプション設定

　先日Blogの記事にもしましたが，画像スライドショーで利用しているbxSliderはオプションで様々な設定ができます。個人的には前後の画像に移動する矢印などを表示させたいのですが，オプション設定をいれてもうまく表示されません。使い方を解説しているWebサイトを色々調べてトライしましたが，私の技術力ではできませんでした。

やり方を変えてみよう

　なかなか解決の糸口が見えない状態だったので，思いきって違うやり方にしようと考え，ギャラリーコンテンツのように，jQueryを使わないものを調べてみました。

その中で見つかったのがSwiper.jsというJavascriptライブラリです。レスポンシブ対応，jQuery不要ということで，こちらを使ってみることにしました。

トップページの画像スライドショーを変更しました

　詳しい作業内容は後日記事にしようと思いますが，ギャラリーコンテンツを設置したときと同じ要領でファイルの設定を行い，bxSlider用に作成した設定ファイルを書きかえて進めました。

Swiper.jsもbxSliderと同様にオプション設定が豊富で使い方の解説をしているWebサイトも多いようです。オプションがたくさんあるので，設定のしかたを覚えるまでは大変ですがマスターすればかなり使えそうです，

現在はトップページのフッタ上の画像スライドショーをSwiper.jsを使ったものにしています。カバーフローというエフェクトを適用したり，前後の画像に移動する矢印や現在何番目の画像を表示しているかを示す●の表示もカスタマイズしています。