fly.js抛物线连续不断加入购物车

来源:https://www.sucaihuo.com/js/298.html 2015-08-20 17:48浏览(1860) 收藏

本文以fly.js抛物线插件来完成加入购物车效果
fly.js抛物线连续不断加入购物车
分类:3D > 抛物线 难易:中级
查看演示 下载资源 下载积分: 20 积分

HTML

<div class="m-sidebar">
    <div class="cart">
        <i id="end">
        </i>
        <span>
            购物车
        </span>
    </div>
</div>

jQuery

$('html,body').on('click', addProduct);
function addProduct(event) {
    var offset = $('#end').offset(),
    flyer = $('<img class="u-flyer" src="images/profile-80_1.jpg"/>');
    flyer.fly({
        start: {
            left: event.pageX,
            top: event.pageY
        },
        end: {
            left: offset.left,
            top: offset.top,
            width: 20,
            height: 20
        }
    });
}
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2