A beginner asking a question about a UI animation

A beginner asking a question about a UI animation

I am posting this question in this forum because I see other similar questions.  Please let me know if this question should be posted in other forums.

I cannot seem to get any animation effects working in JQuery.  So, I copied the example located at:


Here is my code:

<html> 

<head> 
<title> favorites / bookmark title goes here </title>
<script src="./jquery-1.4.2.min.js"></script>
</head>
<body bgcolor="white" text="blue">
<div id="clickme">
            Click here
        </div>
        <img id="book" src="Axciom.jpg" alt="" width="100" height="123" style="visiblity:hidden" />
                With the element initially hidden, we can show it slowly:
<Script>
          $('#clickme').click(function() {
            $('#book').fadeIn(20000, function() {
              // Animation complete
alert("Animation Complete");
            });
          });
</script>
</body>
</html>

When I open the page, located at:

C:\inetpub\wwwroot\aspclassicapps\Demo\JQTestPage.asp

the logo is already displayed.  If I press the "clickme" div, nothing appears to happen other than the alert dialog opening.  Note that I also tried this without the visibility attribute in the <img> element.

I would appreciate some guidance here.  Thank you for your comments and assistance!