如何解决产品飞入购物车效果出错?

var imgtodrag = $("#pic"+Product_Id);
if (imgtodrag) {
var imgclone = imgtodrag.clone().offset({
top: imgtodrag.offset().top-10,
left: imgtodrag.offset().left+10
}).css({
'opacity': '0.8',
'position': 'absolute',
'height': '180px',
'width': '180px',
'z-index': '100'
}).appendTo($('body')).animate({
'top': cart.offset().top + 30,
'left': cart.offset().left + 30,
'width': 90,
'height': 90
}, 2000, 'easeInOutExpo');
setTimeout(function () {
cart.effect('shake', { times: 4 }, 300);
}, 2200);
imgclone.animate({
'width': 0,
'height': 0
}, function () {
$(this).detach();
//console.log("a");

});
}

});
上面是飞入购物车代码.类似https://www.17sucai.com/pins/demo-show?id=17814 点加入购物车按钮时有产品图片飞入购物车效果.正常起飞位置是产品图片所在位置.但是在热销产品滚动栏上有几个产品不是从产品图片位置起飞.而是错误的从屏幕最左侧起飞.
滚动栏热销产品是从数据库选择20个,向右滚动.但是每次当排序最后的产品出现在滚动栏上最左侧时.此产品以及它右侧的几个产品的起飞位置就会变成从错误的屏幕最左侧起飞.有没有办法解决?

参考GPT和自己的思路:

这个问题可能是由于代码中的计算错误引起的。在这种情况下,可能需要检查代码中的坐标计算,以确保它们正确。此外,还需要考虑页面中其它元素对这个图片飞入购物车效果的影响,例如CSS样式和其它JavaScript代码。如果这些方面都没有问题,那么可能是由于浏览器的不同版本或类型导致的问题。在这种情况下,可能需要对代码进行兼容性测试,以确保在各种浏览器版本和类型上都可以正常工作。