购物车抛物线效果

<div class="js_add">加入购物车div>
<div class="js_goods_PriceShop">购物车div>
.u-flyer {width: 24px;height: 24px;position: fixed;
}
$('.js_add').click(function(evt){var offset = $('.js_goods_PriceShop').offset();var scrollTop = $(document).scrollTop();//获取默认滚动条高度$(window).resize(function(){//窗口改变重新获取offset=$('.js_goods_PriceShop').offset();});$(window).scroll(function() { //滚动条改变scrollTop=$(window).scrollTop(); });var $ball = $('').appendTo("body");$ball.css("top",evt.pageY-scrollTop+'px')$ball.css("left",evt.pageX+'px')$ball.css("transition",'left 0s, top 0s')setTimeout(()=>{$ball.css("top",offset.top-scrollTop+'px')$ball.css("left",offset.left+'px')$ball.css("transition",'left 0.5s, top 0.5s ease-in')},20)setTimeout(function(){$ball.remove()},500)
})


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部