Move the div element to the middle of the screen in the animation

Question

How do you animate a div element in the middle of the screen on the left side

I get this invalid obect or prperty I can no longer reference the jQuery (document) object via jQuery

form.each(function () { jQuery(this).animate({ marginLeft: jQuery(document).width / 2 }, 750); <-- this line here gives me errors jQuery('input[name^=Next]').click(function () { }); }); 

Answer 1

You want to use .animate to animate the marginLeft div marginLeft . Just check out the examples. Here is a quick layout:

 $('#myDiv').animate({ marginLeft: '+=' + $(document).width() / 2 }, 5000, function() { // Animation complete. }); 

Demo: http://jsfiddle.net/karim79/W6v2B/

Answer 2

Use jQuery Animation

Here is a simple example:

HTML:

 <div id='walker'>Hello World</div> <input type='button' id='move' value='move'> 

JQuery

 jQuery(document).ready(function(){ jQuery('#move').live('click', function(event) { $("#walker").animate({marginLeft: $(window).width()/2,}, 1500 ); }); }); 

Demo

• Fun With jQuerys Animate () Function