jQuery はショッピング カートに追加するアニメーション効果を実装します_jquery

.box{浮動小数点:左;幅:198ピクセル;高さ:320ピクセル;マージン左:5px;ボーダー:1px ソリッド #e0e0e0; text-align:center}
.box p{行の高さ:20px;パディング:4px 4px 10px 4px; text-align:left}
.box:hover{border:1px ソリッド #f90}
.box h4{行の高さ:32px;フォントサイズ:14px; color:#f30;font-weight:500}
.box h4 スパン{font-size:20px}
.u-flyer{表示: ブロック;幅: 50ピクセル;高さ: 50ピクセル;境界半径: 50ピクセル;位置: 固定;z-インデックス: 9999;}
.m-sidebar{位置: 固定;上: 0;右: 0;背景: #000;z-index: 2000;幅: 35px;高さ: 100%;フォントサイズ: 12px;色: #fff;}
.cart{color: #fff;text-align:center;line-height: 20px;padding: 200px 0 0 0px;}
.cart スパン{表示:ブロック;幅:20px;マージン:0 自動;}
.cart i{幅:35px;高さ:35px;表示:ブロック;背景:url(car.png) 繰り返しなし;}
#msg{位置:固定;上:300ピクセル;右:35ピクセル; z インデックス:10000;幅:1ピクセル;高さ:52ピクセル;行の高さ:52px;フォントサイズ:20px;テキスト整列:中央;色:#fff;背景:#360;表示:なし}

<スクリプト>
$(function() {
    var offset = $("#end").offset();
    $(".addcar").click(function(event){
        var addcar = $(this);
        var img = addcar.parent().find('img').attr('src');
        varFlyer = $('');
        フライヤー.fly({
            開始: {
                left:event.pageX, //開始位置（必須）#fly元素会被設置位置:fixed
                top:event.pageY //开開始位置（必須）
            }、
            終了: {
                left: offset.left 10, //结束位置（必須）
                top: offset.top 10, //结束位置（必須）
                width: 0, //结束時間宽度
                height: 0 //終了時の高さ
            }、
            onEnd: function(){ //结束回调
                $("#msg").show().animate({width: '250px'}, 200).fadeOut(1000); // 提案情報
                addcar.css("カーソル","デフォルト").removeClass('オレンジ').unbind('クリック');
                this.destory(); //移除ダム
            }
        });
    });
});