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