こんにちは、デザイナーの奥田です。 最近フロントエンドでは「脱jQuery」なんて言われていますね。 まだまだjQueryバリバリ書いてますって方もちょっとずつ「脱jQuery」していくとこの先もスキルが活かせると思います。 さて、今回は「もう最近の案件はこれしか使っていないんじゃないか?」というぐらい高機能で便利なスライダーをご紹介いたします。 Table of contentsSwiperの使い方カルーセル表示にするレスポンシブに対応するPC時はグリッド表示、スマホ時にスライドにするサムネイル付きカルーセル表示その他オプションまとめSwiperの使い方まずは普通に使ってみましょう。下記よりファイルをダウンロードするかCDNでの使用でも実装できます。 SwiperCDN CSSとJSを読み込みます。 <html> <head> <link rel="stylesheet" href="h
![レスポンシブ対応でjQuery不要の高機能スライダー「Swiper」 | Will Style Inc.|神戸にあるウェブ制作会社](https://cdn-ak-scissors.b.st-hatena.com/image/square/aa503cf737067a94be7657889a334918e365de7f/height=288;version=1;width=512/https%3A%2F%2Fwillstyle.co.jp%2Fw%2Fwp-content%2Fuploads%2F2017%2F03%2Fswiper-main-2000x1078.jpg)