面对Jquery的问题添加到购物车飞行效果 [英] Facing problem in Jquery Add to Cart Fly Effect

问题描述

大家好..



我在申请加入购物车时遇到问题飞影效果..

我是使用JSON绑定产品。（Webservice）

添加到购物车飞行效果工作正常，但每当我添加任何产品时，它会飞行第一张图像而不是我添加到购物车中的图像..



我的产品Div因为我正在追加数据看起来像

Hi All..

I'm facing a problem in applying Add to Cart Fly Image effect..
i'm Binding Product using JSON.(Webservice)
Add to Cart fly effect working fine but every time when i add any product it Flies First Image instead of Image which i'm adding to Cart..

My Product Div as i'm Appending Data looks like

<div class='col-sm-4'><div class='product-image-wrapper'><div class='single-products'> <div class='productinfo text-center' id='shakeimg'><img src='" + data.d[i].ImgPath + "'/> <h2>₹" + data.d[i].Price + "</h2> <p>" + data.d[i].ProductName + "</p> <a href='#' class='btn btn-default add-to-cart' >Add to cart</a>	</div>

和使用Jquery进行飞行效果

and Using Jquery For Flying Effect

<script type="text/javascript" src="js/shakejquery-ui.min.js"></script>
   <script type="text/javascript" src="js/shakecartjquery.min.js"></script>
   <script type="text/javascript">
       function ShakeCart() {

           var cart = $('#licart');

           var imgtodrag = $('#shakeimg').find('img');
           //var imgtodrag = $(this).find('img');
           if (imgtodrag) {
               var imgclone = imgtodrag.clone().offset({
                   top: imgtodrag.offset().top,
                   left: imgtodrag.offset().left
               }).css({
                   'opacity': '0.5',
                   'position': 'absolute',
                   'height': '150px',
                   'width': '150px',
                   'z-index': '100'
               }).appendTo($('body')).animate({
                   'top': cart.offset().top + 10,
                   'left': cart.offset().left + 10,
                   'width': 75,
                   'height': 75
               }, 1000, 'linear');
               setTimeout(function () {
                   cart.effect('shake', { times: 2 }, 200);
               }, 1500);
               imgclone.animate({
                   'width': 0,
                   'height': 0
               }, function () {
                   $(this).detach();
               });
           }
       }
       
   </script>

请各位帮帮我

提前致谢..

Please guys help me
Thanks in advance..

推荐答案

（'＃licart'）;

var imgtodrag =

('#licart'); var imgtodrag =

（'＃shakeimg'）。find（'img'）;
// var imgtodrag =

('#shakeimg').find('img'); //var imgtodrag =

（this）.find（'img'）;
if（imgtodrag）{
var imgclone = imgtodrag.clone（）。offset（{
top：imgtodrag.offset（）。top，
left：imgtodrag.offset（） .left
}）。css（{
'不透明'：'0.5'，
'位置'：'绝对'，
'高度'：'150px'，
'width'：'150px'，
'z-index'：'100'
}）。appendTo（

(this).find('img'); if (imgtodrag) { var imgclone = imgtodrag.clone().offset({ top: imgtodrag.offset().top, left: imgtodrag.offset().left }).css({ 'opacity': '0.5', 'position': 'absolute', 'height': '150px', 'width': '150px', 'z-index': '100' }).appendTo(

这篇关于面对Jquery的问题添加到购物车飞行效果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！