jQuery slidedown() Animation nicht funktioniert

Question

Ich versuche, jQuery slideDown() Animation zu arbeiten, aber in meinem Fall der Text, der sollte nach unten rutschen, zu bekommen nur erscheint .. Wie mache ich es mit der Animation erscheinen an Ort und Stelle?

Ich habe versucht, manuell die Geschwindigkeit zu spezifizieren, aber Endergebnis war das gleiche.

HTML:

<section class="subscribe"> 
    <button id="submitBtn" type="submit">Subscribe</button> 
    <p></p> 
</section> 

JavaScript:

$(function() { 
    $("#submitBtn").click(function (event) { 
     $(".subscribe p").html("Thanks for your interest!").slideDown({ 
         duration: 4000 
        }); 
    }); 
}); 

JSFiddle:http://jsfiddle.net/ahmadka/A2mmP/

Answer 1

Ihr p Element ist bereits angezeigt, wenn Sie den Text eingeben und tr y, um es nach unten zu schieben. Also keine Animation wird benötigt.

$(function() { 
    $("#submitBtn").click(function (event) { 
    $(".subscribe p").hide().html("Thanks for your interest!").slideDown(4000); 
    }); 
}); 

Answer 2

Sie können den Inhalt zunächst versteckt tun haben und dann einfach mit der slideDown Funktion zeigt:

HTML

<section class="subscribe"> 
    <button id="submitBtn" type="submit">Subscribe</button> 
    <p>Thanks for your interest!</p> 
</section> 

CSS

.subscribe p{ 
    display:none; 
} 

jQuery

$(function() { 
    $("#submitBtn").click(function (event) { 
     $(".subscribe p").slideDown({duration: 400}); 
    }); 
}); 

Wohnbeispiel: http://jsfiddle.net/A2mmP/2/

Answer 3

Ihr modifizierten Code

$(function() { 
    $("#submitBtn").click(function (event) { 
     $(".subscribe p").html("Thanks for your interest!").hide().slideDown('400'); 
    }); 
}); 

prüfen diese demo