ブログ

WEB制作に関する技術情報やサンプルコードからエクセルや
パワーポイントのお役立ち情報まで幅広くご紹介しています。

ページ表示時にボタンが順番にスライドイン&フェードイン

ページが表示された際に、左から順番にスライドイン&フェードインするナビゲーションを作成してみました。
サイトのちょこっとした演出にいかがでしょうか?

>サンプル

jquery

[javascript]
$(window).load(function(){
//スライドインのスピード
var SlideIn = 150;
//フェードインのスピード
var FadeIn = 800;
$(‘ul li’).each(function(i){
$(this).delay(i*(SlideIn)).css({display:’block’,opacity:’0′,top:’0′}).animate({opacity:’1′,top:’30’}).animate({top:’25’},FadeIn);
});
});
[/javascript]

投稿日
2015年3月26日
カテゴリー
JavaScript

コメントを残す

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

デザイン&メディア事業blow→in
大阪府泉佐野市市場西3-2-34-306
TEL.072-493-3358(代)
[日根野オフィス]
大阪府泉佐野市日根野3963-3-403
TEL.072-468-8786
プリント事業HANDPURI
大阪府泉佐野市日根野4036-1
TEL.0120-610-322
アパレル事業DIGMO
大阪府大阪市西区南堀江1-22-1
TEL.070-9260-4982
ブランディング事業かつらぎフルーツ
和歌山県かつらぎ町東渋田325-4
TEL.090-3612-3401
飲食店事業cafeblow
大阪府泉佐野市日根野3963-3
TEL.090-5127-9187