CODEWITHSUNDEEP
javascriptjqueryanimation
Metzed
Metzed

Reputation: 491

How do I run animate() once the page has loaded?

I have a menu item that is animated in the following fiddle by clicking a link, but I actually want the background color fade animation to start once the page has loaded (without the need to click a link). How do I change the code in the following fiddle to animate once the page has loaded?

The code I have currently is:

$("a").click(function(e) { 
  e.preventDefault();
  for (var i = 0; i < 2; i++ ) {
    $("#menu-item-9032 a")
      .animate( { backgroundColor: "#00afee", color: "#363a47" }, 2000 )
      .animate( { backgroundColor: "transparent", color: "#363a47" }, 2000 );
  }
});

http://jsfiddle.net/Fe8Jy/500/

If I replace $("a").click(function(e) { with $(document).ready(function() { nothing happens, what am I doing wrong?

Upvotes: 0

Views: 36

Answers (1)

mpen
mpen

Reputation: 282895

You must have created a syntax error. Code works fine with jQuery's ready:

http://jsfiddle.net/tks2sobo/

$(function() {

    for (var i = 0; i < 2; i++ ) {
        $("#menu-item-9032 a")
            .animate( { backgroundColor: "#00afee", color: "#363a47" }, 2000 )
            .animate( { backgroundColor: "transparent", color: "#363a47" }, 2000 );
    }
});

Upvotes: 1

Related Questions