1

This is my HTML page:

<!DOCTYPE html>
<html lang="en">

    <head>

        <title>Example</title>

        <meta charset="utf-8">

        <link rel="stylesheet" type="text/css" href="content/main.css">

        <script src="content/jquery.js" type="text/javascript"></script>
        <script type="text/javascript">
        $("#container").animate({
            'background-position': '1110px 1110px'
        }, 1000, function () {
        });
        </script>

    </head>

    <body>

        <div id="container">

            <p>hello</p>

        </div>

    </body>

</html>

The div container is supposed to animate using that JavaScript code but nothing happens to the page when opened. What am I doing wrong here?

Markum
  • 3,919
  • 8
  • 26
  • 30

1 Answers1

1

Your code is being run before DOM tree has been completely built. So you need to wrap it with

$(function() { // <--- begin of the wrap

        $("#container").animate({
            'background-position': '1110px 1110px'
        }, 1000, function () {
        });

}); // <---- end of the wrap

http://api.jquery.com/ready/

zerkms
  • 249,484
  • 69
  • 436
  • 539
  • I seem to have made it work by moving to jQuery 1.4.4, however this animate code only moves the background once, can it be looped? – Markum May 18 '12 at 03:47
  • Wrap your animation code in a function and in animate callback call itself – zerkms May 18 '12 at 03:48