2014-11-23 94 views
0

在此page我希望客戶知道已添加到購物車中的東西。javascript動作後激活div

我想知道如何做到以下幾點:

點擊「加入購物車」,即通過點擊「我的購物車」(右上)揭示了抽屜後自動打開,顯示添加的項目。

我該如何在JavaScript中做到這一點?

我相信這是抽屜的功能:

// Add to cart animation 
$(".add-to-cart").click(function(e){ 

    var elem = $(this); 
    elem.prop("disabled", true); 

    $("body").on("click", ".checkout", disable); 

    e.preventDefault(); 

    function animate() { 

    // $("#cart-animation").show() // 

    var addtocartWidth = elem.outerWidth()/2; 
    var addtocartHeight = elem.outerHeight()/2; 

    var addtocartLeft = elem.offset().left + addtocartWidth; 
    var addtocartTop = elem.offset().top + addtocartHeight ; 

    var buttonAreaWidth = $(".cart-target").outerWidth(); 
    var buttonAreaHeight = $(".cart-target").outerHeight(); 

    var buttonAreaLeft = $(".cart-target").offset().left + buttonAreaWidth/2 - $("#cart-animation").outerWidth()/2; 

    var htmlMargin = $('html').css('margin-top') 
    var htmlMarginTrim = parseInt(htmlMargin); 

     if (htmlMargin !== 0) { 
     var buttonAreaTop = $(".cart-target").offset().top + buttonAreaWidth/2 - htmlMarginTrim - $("#cart-animation").outerHeight()/2 ; 
     } else { 
     var buttonAreaTop = $(".cart-target").offset().top + buttonAreaWidth/2 - $("#cart-animation").outerHeight()/2 ; 

     } 

    var path = { 
     start: { 
     x: addtocartLeft, 
     y: addtocartTop, 
     angle: 190.012, 
     length: 0.2 
     }, 
     end: { 
     x: buttonAreaLeft, 
     y: buttonAreaTop, 
     angle: 90.012, 
     length: 0.50 
     } 
    }; 

    $('#cart-animation').animate(
     { 
     path : new $.path.bezier(path) 
     }, 
     1200, 
     function() { 
     $(elem).prop("disabled", false) 
     $("#cart-animation").fadeOut(500); 
     elem.closest('form').submit(); 
     $("body").off("click", ".checkout", disable); 
    } 
    ); 
    } 

    animate(); 
}) 

回答

0

你可以只觸發按鈕我的購物車點擊事件,這樣你將使用已經寫好的代碼,而不是自己重寫它的:

$(".toggle-drawer").trigger("click"); 

希望它有助於

+0

得到它。點擊添加到購物車時,我怎麼會觸發這個想法,所以只有在添加購物車成功時纔會觸發這個想法? – rs19 2014-11-23 18:20:02

+0

添加到購物車按鈕會在添加操作成功後返回一些內容嗎? – BeNdErR 2014-11-23 18:21:15

+0

這個我相信Shopify.onCartUpdate =功能(購物車) – rs19 2014-11-23 22:38:46