fly
fly copied to clipboard
Published
20 hours ago •
amibug
amibug
解决Demo中一个BUG，图标错乱，不知道算不算BUG。
bug问题：当有滚动条的时候，飞车进入购物车。不是购物车图标的位置。 原因：貌似源代码没有考虑滚动条的情况吧，当有滚定条的时候，需要#end的顶部距离减去滚动条的距离。这样有滚动条的时候，商品也能飞入到右侧的购物车的位置。
解决方案：
$('html,body').on('click', addProduct);
function addProduct(event){
var offset = $("#end").offset(),
var scrollX=$(window).scrollTop(); //获取滚动条的距离。
flyer = $('
');
if(scrollX==0) //判断滚动条的距离变化，如果没有变化
{
flyer.fly({
start: {
left: event.pageX,
top: event.pageY
},
end: {
left: offset.left,
top: offset.top,
width: 20,height: 20
}
});
}
else
{
flyer.fly({
start: {
left: event.pageX,
top: event.pageY-scrollX //这里也要，当有滚动条的时候，点击的时候，img飞出的起始位置不是点击的位置。
},
end: {
left: offset.left,
top: offset.top-scrollX, //#end 的顶部距离减去滚动条的距离
width: 20,height: 20
}
});
}
}
