画面ロード時にメッセージをフェイドアウト

前も使ってたんだけどいざもう一度使おうとしたら思い出せなくて、きっとまた忘れると思うのでメモっておく。

JavaScript:

$(function(){
    $(".notice").fadeOut(6000);
});

HTML:

<p class="notice">ほげほげ</p>

こんな感じで書いておくと、HTMLファイルロード時にnoticeクラスを指定したタグがじわーっとフェイドアウトする。
タグには

.notice {
  background-color: #5C832F;
  color: #fff;
  padding: 4px 10px;
  margin-bottom: 10px;
}

とかスタイル指定しとくと見た目よろしくていいかも。後は左端をパディング取って背景画像張ってみるとか。


参考:jQuery日本語リファレンス