根据条件显示添加购物车动画

点击加号添加购物车 数量增加并出现添加动画,随后该对象变为减号,点击减号只改变数量不出现动画。

// 选题动画
function addShopping(obj, endElement,iconImg) {
var $endElement = $(endElement);// 动画结束对象
var $target = obj; // 动画开始对象
x = $target.offset().left;
y = $target.offset().top;
X = $endElement.offset().left;
Y = $endElement.offset().top;
if (!($(document).find("#cartIcon").length > 0)) {
$('body').append('<div id="cartIcon" style="width:50px;height:50px;padding:2px;background:#fff;border:solid 5px #e54144;overflow:hidden;position:absolute;z-index:890;"><img src="' + iconImg + '" width="50" height="50" /></div>');
var $obj = $("#cartIcon");
if (!$obj.is(':animated')) {
$obj.css({ 'left': x, 'top': y }).animate({ 'left': X, 'top': Y + 70 }, 500, function () {
$obj.stop(false, false).animate({ 'top': Y - 20, 'opacity': 0 }, 500, function () {
$obj.fadeOut(300, function () {
$obj.remove();
});
});
});
}
}
}

猜你喜欢

转载自www.cnblogs.com/wangjingan/p/11639637.html
今日推荐