首页 > jQuery实现加入购物车飞入动画效果

实现加入购物车飞入动画效果,jQuery实现加入购物车飞入动画效果

互联网 2021-01-17 11:45:50
在线算命,八字测算命理

购物车按钮: 加入购物车 实现代码:

$(function() { var offset = $(".shop-cart").offset(); $("#addcar").click(function(event){ varpid=$("#productId").val(); $.get('${base}/cart/add.jhtml',{'id':pid,'quantity':1},function(message){ if(message.type=='success'){ var addcar = $(this); var img = $("#pikame li").find('img').attr('src'); var flyer = $(''); flyer.fly({ start: { left: event.pageX, top: event.pageY }, end: { left: offset.left+10, top: offset.top+10, width: 0, height: 0 }, onEnd: function(){ $("#msg").show().animate({width: '200px',height:'50'}, 200).fadeOut(1000); $("#addcar").unbind('click'); this.destory(); } }); }else{ $("#error").show().animate({width: '200px',height:'50'}, 200).fadeOut(1000); } }); });}); offset() 方法设置或返回被选元素相对于文档的偏移坐标。 当用于返回偏移时:  该方法返回第一个匹配元素的偏移坐标。它返回一个带有两个属性(以像素为单位的 top 和 left 位置)的对象。 当用于设置偏移时:  该方法设置所有匹配元素的偏移坐标。

插件下载:

点击打开链接

免责声明:非本网注明原创的信息,皆为程序自动获取自互联网,目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责;如此页面有侵犯到您的权益,请给站长发送邮件,并提供相关证明(版权证明、身份证正反面、侵权链接),站长将在收到邮件24小时内删除。