Ответы пользователя по тегу WooСommerce
  • Как сделать товары улетающие в корзину?

    @hesy
    Код анимации

    $(document).ready(function() {
        // Когда документ полностью загружен и готов к работе...
        
        $(".ajax_add_to_cart").on("click", function() {
            // При клике на элемент с классом "ajax_add_to_cart"...
            
            var productImage = $(this).closest(".post").find("img");
            // Находим ближайший родительский элемент с классом "post" и внутри него ищем изображение (тег <img>)
            
            productImage
                .clone() // Клонируем изображение товара
                .css({
                    position: "absolute", // Позиционируем клон абсолютно на странице
                    "z-index": "11100", // Устанавливаем высокий порядок слоя для клонированного изображения
                    top: productImage.offset().top, // Устанавливаем верхнюю позицию клонированного изображения
                    left: productImage.offset().left // Устанавливаем левую позицию клонированного изображения
                })
                .appendTo("body") // Добавляем клонированное изображение внутрь элемента body страницы
                .animate({
                    opacity: 0.05, // Задаем конечную прозрачность для анимации
                    left: $("#cart-punkt").offset().left, // Устанавливаем конечную левую позицию для анимации
                    top: $("#cart-punkt").offset().top, // Устанавливаем конечную верхнюю позицию для анимации
                    width: 20 // Устанавливаем конечную ширину для анимации
                }, 1000, function() {
                    // По завершении анимации...
                    
                    $(this).remove(); // Удаляем клонированное изображение
                });
        });
    });



    Ответ написан
    Комментировать