求助:如何用jQuery制作一个飞进购物车的动画?

我举个例子,应该对你有帮助。

这是html

& lt输入?id="Button1 "?type="button "?value="button "?/& gt;

& lt桌子?style="width:?100%;"& gt

& lttr & gt

& lttd & gt

& ltdiv?style = " width:100 px;?身高:?100 px;?边框:?1px?固体?#f08080 "?id = " shop " & gt购物车

& lt/TD & gt;

& lttd & gt& ampnbsp& lt/TD & gt;

& lttd & gt& ampnbsp& lt/TD & gt;

& lt/tr & gt;

& lttr & gt

& lttd?style="height:?500像素" >& ampnbsp& lt/TD & gt;

& lttd & gt& ampnbsp& lt/TD & gt;

& lttd & gt& ampnbsp& lt/TD & gt;

& lt/tr & gt;

& lttr & gt

& lttd & gt& ampnbsp& lt/TD & gt;

& lttd & gt& ampnbsp& lt/TD & gt;

& lttd & gt

& ltdiv?style="width:?50px?身高:?50px?背景色:?#f08080 "?id = " product " & gt

商品

& lt/div & gt;

& lt/TD & gt;

& lt/tr & gt;

& lt/table & gt;这是jQuery代码:

$(function()?{

$("#Button1 ")。点击(函数()?{

var?shopOffset?=?$("#shop ")。offset();

var?cloneDiv?=?$("#product ")。clone();

var?证明?=?$("#product ")。offset();

cloneDiv.css({?“位置”:“绝对”,?“顶”:proOffset.top,?“左”:偏左?});

$("#product ")。父级()。append(clone div);

cloneDiv.animate({

左:?shopOffset.left,

top:?shopOffset.top

},“慢”);

});

});