jQueryを使って並べられた画像を順々に表示させる方法

2016/4/3更新

ほとんどのフリーランスのWebデザイナーの人が自分のポートフォリオを作っていることでしょう。ここに一人、例外がおりますが(汗

※現在キューピッチで制作中です

ポートフォリオサイトを作る時に単純に画像が表示させるだけだと、ちょっと味気ないなぁって。
そこで簡単にjQueryを使って画像を順々にフェードインで表示させる方法を紹介します。

HTML

ダミー画像を用意する時はこのサイトが便利です。
Placehold.jp http://placehold.jp/

CSS

横に並べるのはfloatでもinline-blockでもflexboxでも何でもいいです。

jQuery

デモページ

delayTimeの部分で画像がどれくらい遅れて表示されるかを調整します。

ご不明な点があればお気軽にコメントください( ˘ω˘)

タイムチケットやってます!

コメントを残す

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

CAPTCHA


トラックバック:https://recost-design.com/1778.html/trackback