codehaven - php snippets - coding help
Generic filters
Exact matches only
    • octopus energy discount code

    Fly to Cart effect

    27th October 2018

    Jquery - Tricks

    jquery icon

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
     
    $('.add-to-cart').on('click', function () {
            var cart = $('.shopping-cart');
            var imgtodrag = $(this).parent('.item').find("img").eq(0);
            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, 'easeInOutExpo');
                
                setTimeout(function () {
                    cart.effect("shake", {
                        times: 2
                    }, 200);
                }, 1500);
     
                imgclone.animate({
                    'width': 0,
                        'height': 0
                }, function () {
                    $(this).detach()
                });
            }
        });
     

    Was this code snippet helpful?

    RSS Latest Snippets
    LINKS
    A Repository of Code Snippets in many Programming Languages:-

    PHP – JQUERY
    CSS – MYSQL
    WORDPRESS – JAVASCRIPT
    WOOCOMMERCE – HTML

    © 2022 CODEHAVEN