My current theme Masonry does support it using the Ajax API, I just don't understand how to edit the code to show an entire window of HTML formatted content instead of just the text from a particular div:
Currently it looks like this:
//Added, show message & update cart display window.showQuickPopup("Added to cart, thank you!", $form.find('input[type="submit"]:first')); $.get(shopifyAjaxStorePageURL, function(data){ var $newCartObj = $(data).find('#navpanel .cartsummary'); var $currCart = $('#navpanel .cartsummary'); if($currCart.length == 0) { $('#shoplogo').after($newCartObj); } else { $currCart.html($newCartObj.html()); } });
//Function to show a quick generic text popup above an element window.showQuickPopup = function(message, $origin){ var $popup = $('<div>').addClass ('simple-popup'); var offs = $origin.offset(); $popup.html(message).css({ 'left':offs.left, 'top':offs.top }).hide(); $('body').append($popup); $popup.css('margin-top', - $popup.outerHeight() - 10); $popup.fadeIn(200).delay(3500).fadeOut(400, function(){ $(this).remove(); }); }; {% endif %}