【WordPress】カスタムフィールドを使って、スライダー画像をPC表示とSP表示で切り替える方法
今回はAdvanced Custom Fields（以下、ACF）を使って、スライダーに使う画像をPC表示とSP表示で切り替える方法を紹介します。 前提条件は以下 Advanced Custom Fi...
【スライダー実装】の記事
【Swiperスライダー】バラバラの画像サイズを上下中央に揃えて実装する方法
今回はSwiperスライダーを使って、バラバラの画像サイズを上下中央に揃える方法を紹介します。縦向きと横向きの画像を一緒にスライダーさせたいときなど、画像の横幅や高さが違う場合にオススメの実装方法です...
Swiperでパララックス スライダーを実装する方法 - サムネイル付き
今回はSwiper.jsを使ってパララックスするスライダーの実装方法を紹介します。奥行きのあるスライダーを実装したい方にオススメです。 ・デモサイト 実装内容は以下。 Swiperの４系を使用（IE対...
背景画像をズームアップしながらフェードで切り替えるスライダー - Swiperで実装する方法
今回は背景画像をズームアップさせながらフェードで切り替えるスライダーを、Swiperを使って実装します。Swiperなどのプラグインを使わなくても実現できますが、ページネションの設定や１ページに複数ス...
背景画像をフェードで切り替えるスライダーswiper.jsの使い方（ページネーションあり）
背景画像をフェードで切り替えて、さらにページネーションも使えるスライダーを紹介します。背景画像を全画面で表示したいときに便利なスライダーです。jQueryを使わず単体で動作します。 ※今回はswipe...
ズームアウトしながらフェードで切り替わるZoom Sliderの使い方
ズーム系スライダーを実装する方法はいくつかありますが、今回はjQueryを使って手軽に実装できるZoom Sliderを紹介します。 ※2019/12/5 追記 ズーム系のスライダーならSwiperを...