jquery FadeIn nicht

Question

Arbeits

Kann mir bitte jemand sagen, was ich falsch mache:

Stil:

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

Markup:

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

Skript:

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

Answer 1

Solange das Element nicht ausgeblendet ist, wird keine Überblendung auftreten, Sie brauchen es mething wie folgt aus:

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

You can give it a try here wird auch $() in 1.4+ veraltet, Sie $(document) oder die kürzere Version, wie diese verwendet werden soll:

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

Die Alternative ist ein display: none zunächst das Element geben aber dies bricht für JS-behinderte Benutzer, oder wenn JavaScript-Fehler auftreten verhindern die Fade, so möchten Sie vielleicht von diesem Ansatz zu vermeiden.

Answer 2

Fügen Sie display:none zu Ihrem CSS-Code hinzu.

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

Answer 3

Ich würde eher denken, dass Sie möchten, dass ein Ereignis für das Fadin verwaltet wird. siehe Arbeitsbeispiel hier: http://jsfiddle.net/hPHPn/

So:

$(document).ready(function(){ 
    $(".warning").hide();// hide it initially 
    $('#unhideit').click(function(){ 
     $(".warning").fadeIn(4000);       }); 
}); 

für einige einfache Markup:

<p class="warning">A successful authorization already exists 
    for this Quote ID. Further authorizations are not allowed at this time.</p> 
<input type="button" id="unhideit" value="clickme" /> 

Answer 4

Ich habe vor kurzem die gleiche Sache in meiner Anwendung getan. An der Spitze meiner html Dokument Ich habe:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script type="text/javascript" src="advtemp3jquery.js"></script> 

Der Teil der src="advtemp3jquery.js bezieht sich auf meine externe .js Datei sagt. Ich finde es besser, den Code in einer externen Datei zu behalten.

Das Skript führt Folgendes aus:

$(document).ready(function() { 
    $('.header1,.header2').fadeIn('4000'); 
});