jQuery fadeIn duration having no effect

I am trying to use jQuery fadIn function in my web app but the duration/speed parameter is having no effect whatsoever. Here is the HTML code:

<!DOCTYPE html>
<html>
<head>
    <title>Web App Test Bench</title>
    <meta name="viewport" content="user-scalable=yes,width=device-width" />
    <meta charset="ISO-8859-1"/>
    <link rel="icon" type="image/png" href="mj_logo.png" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0 /jquery.mobile-1.1.0.min.css" />


    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>


<script type="text/javascript" src="test.js"></script>
<body>
    <section id="page1" data-role="page">

    <div data-role="content" class="content">

    <img id="logo" src="welcomeLogo.jpg" alt="Welcome Logo"/>

    </div>

</section>

</body>
</html>

And the javascript is:

$(document).ready(function()
{
    $("#logo").hide().fadeIn("8000",function()
    {
        console.log("The animation is done");
    }
    ).fadeOut("8000");


})

No matter which value, big or small I choose, the animation is done in a flash.Any suggestions as to what could be the problem?

Solution

You need to pass the speed as an integer instead of a string value, making your code:

$(document).ready(function()
{
    $("#logo").hide().fadeIn(8000,function()
    {
        console.log("The animation is done");
    }
    ).fadeOut(8000);   
})

If you do want to use a string value, you can use 'fast' and 'slow' to indicate durations of 200 and 600 milliseconds, respectively.