【CSS】スライド上のテキストやボタンをアニメーションさせたい – expexp.jp2017.09.062021.03.24 ホームや商品紹介ページなどで多く使われるスライドショー。単純に画像をスライドさせるだけでは面白くないという方におすすめな小技を紹介します。 今回紹介するスライダーのプラグインはSwiperを使用しています。レスポンシブ対応で人気のslickでも同じことができますが、同じくレスポンシブ対応でjQueryが不要なSwiperを採用しました。 動作サンプルページ実際のアニメーションサンプルはこちら。 サンプル01スライド上にテキストがフェードインで現れます。 HTML・CSS<div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="s-fade-wrap"> <img src="img/img-640x480.gif
