Question

$(document).ready(function() {
    $(".div1").click(function() {
        $(".div2").stop().animate(...);
    });
});

div1 and div2 are both divs in <div id="content">.

I want to click div1, then div2’s position will go to: top:0px; left:200px; which is relative to <div id="content" style="width:800px;margin:0 auto;">

How to write the animate part?

Answer 1

You can just pass an object to .animate() with top and left properties, like this:

$(document).ready(function() {
    $(".div1").click(function() {
        $(".div2").stop().animate({ top: 0, left: 200 });
    });
});

Make sure the element has a relative or absolute position set here, whichever you’re going for, otherwise top and left will have no effect.