仿淘宝购物车飞入效果

插件： jquery.fly.min.js

使用方法：

            

            var  offset =  $( "#addGoodsBtn"). offset();              //获取飞行抛物线终点

             this. table. on( 'click', 'a[name="basket"]', function( evt){

                 evt. preventDefault();

                 evt. stopPropagation();

                 //添加购物车飞入的动画效果

                 var  img =  $( this). children( 'img'). attr( 'src');        //获取当前飞入图片链接 

                 var  flyer =  $( '<img class="flyer-img" src="' +  img +  '">'). css( 'z-index', '10');  //新建抛物体对象 

                //开始飞行动画 

                flyer. fly({ 

                     start: { 

                         left:  event. pageX,     //抛物体起点横坐标 

                         top:  event. pageY       //抛物体起点纵坐标 

                    }, 

                     end: { 

                         left:  offset. left +  10,  //抛物体终点横坐标 

                         top:  offset. top +  10,    //抛物体终点纵坐标 

                    }, 

                     onEnd:  function() {       //抛物线飞行结束事件

                         $( "#tip"). show(). animate({ width:  '200px'}, 300). fadeOut( 500); 成功加入购物车动画效果 

                         this. destory();       //销毁抛物体 

                    } 

                }); 

            });