Search code examples
jqueryslidedown

jquery slideIn on element is not working

I cant seem to get the jQuery slide in method working.

Please have a look at my code below. The other jquery methods are working fine.

HTML:

<div id="customers-say">
                <h1>WHAT OUR CUSTOMERS SAY...</h1>  

            </div>

JQUERY: 

$(document).ready(function(){

            $("#customers-say").slideDown("slow");

            $("#f1").fadeIn(1000, function(){
                $("#f2").fadeIn(1000, function(){
                    $("#f3").fadeIn(1000, function(){
                        $("#f4").fadeIn(1000);
                    })
                })
            });


        });
Solution

  • You cannot apply slideDown event to an element that is already visible it must be hidden initially, Slidedown will unhide it slowly.

    In your example simple apply this CSS to your element

    #customers-say {
            background: #de9a44;
            margin: 3px;
            display: none;
            float: left;
      }