0

クロスフェードするシンプルなイメージビューアー

fade-viewer

サイトトップページでよく見られる、フェードで切り替わるメイン画像を簡単に表示してくれるjQueryの「fade-viewer」、
極々シンプルにフェードを繰り返してくれるだけですが、汎用性が高いので使いやすいです。

 

デモサンプル

1.HTMLを記述

ID名「fade-viewer」と名付けたdiv要素の中に<img>タグで4枚画像を並べています。
※ID名は任意です。

 

2.CSSを記述

 <img>要素を親要素の<div>に対して「position:absolute;」にします。

 

3.JavaScriptを記述

 以上になります。




コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

mororeco > JavaScript > クロスフェードするシンプルなイメージビューアー