jquery FadeIn gebrochen

Question

ich knwo nicht, warum die JQuery verblassen in nicht für mein Gehalt div Arbeits

HTML:

<div id="content"> 
     <div id="logo"> 
      <img src="images/blue.jpg" alt="logo" /> 
     </div> 
     <div id="form"> 
      <form action="controler.php" method="post" id="target"> 
      <input id="pass" type="text" value="Password" name="pass" /></form> 
     </div> 
</div> 

Javascript:

$(document).ready(function(){ 
    $("#content").fadeIn(2000); 
    $('#pass').click(function() { 
     this.value=""; 
     return false; 
    }); 
}); 

Es könnte etwas klein, aber ich sein kann es nicht finden

Answer 1

Wenn #content zunächst sichtbar ist, dann hat fadeIn() nichts zu tun, weil das Objekt bereits sichtbar ist.

Wenn Sie den ursprünglichen Stil auf display: none setzen, dann kann fadeIn() es tun.

es zunächst versteckt zu machen, können Sie diese CSS hinzufügen:

#content {display: none;} 

Oder Sie einen Inline-Stil-Tag hinzufügen:.

<div id="content" style="display: none;"> 

Answer 2

Legen Sie den Ausgangszustand des Inhalts-Divs zur Anzeige: keine in der CSS.

Answer 3

Eine einfache Sache könnte sein, dass das div nicht bereits ausgeblendet ist. Wenn es also bereits vorhanden ist, wird es nicht eingeblendet. Wenn ich für diese codiert habe, habe ich eine generische Klasse versteckt, damit sie unsichtbar wird. ...

Answer 4

Sie müssen dann verblassen verstecken

$("#content").hide().fadeIn(2000); 

Answer 5

Genau wie jfriend00 sagt, muss es sein, weil Ihr Element mit ID-Inhalt seit dem Anfang nicht versteckt ist, copy-pas te dieser Code zuerst und sehen, ob es funktioniert:

<div id="content" style="display:none"> 
     <div id="logo"> 
      <img src="images/blue.jpg" alt="logo" /> 
     </div> 
     <div id="form"> 
      <form action="controler.php" method="post" id="target"> 
      <input id="pass" type="text" value="Password" name="pass" /></form> 
     </div> 
</div> 

wenn es funktioniert dann einfach den Stil Inline entfernen „display: none“ und es auf die Stile von #content in Ihrem CSS-Datei hinzufügen:

#content { 
display: none; 
/* the rest of your styles */ 
} 

Wenn dies nicht funktioniert, muss ein anderes Problem bestehen, zuerst ID zu überprüfen, dass Sie die JQuery-Bibliothek in den Kopf des Dokuments einschließen, stellen Sie sicher, dass der Pfad und die Syntax gut geschrieben ist, nehmen Sie dieses Beispiel I gerne googles API URL verwenden:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>