[解決済み] jquery fadeIn が動作しない。

質問

どなたか、私の間違った行動を教えてください。

のスタイルになります。

.warning{border: 1px solid #F0AAAA; background:#FFBABA; color: #C90000;}

マークアップします。

 <p class="warning">A successful authorization already exists. 
                    Further authorizations are not allowed at this time.</p>

スクリプトを実行します。

 $().ready(function () {
     alert($(".warning").html());     // WORKS
     $(".warning").fadeIn(4000);      // DOESN'T WORK
 });

解決方法は？

要素がhiddenでない限り、フェードは発生しないので、以下のようなものが必要です。

$(".warning").hide().fadeIn(4000);

こちらでお試しいただけます また $() は1.4+で非推奨となったので、その場合は $(document) またはこのような短いバージョンです。

$(function() {
  $(".warning").hide().fadeIn(4000);
});

別の方法として、要素に display: none 最初は しかし この方法は、JSが無効なユーザーや、JavaScriptのエラーが発生してフェードができない場合は、動作が不安定になるため、避けた方がよいでしょう。