Как загрузить текстовое содержимое для offmodal onclick

Question

На страницах коллекции моего магазина есть функция быстрого просмотра, в которой наведите курсор на изображения продуктов, чтобы щелкнуть «Быстрый просмотр», чтобы открыть модальное диалоговое окно с краткими сведениями о продуктах. Это делается с плагином leanModal.

См.: http://froy.com/collections/beds-mattresses например. Магазин работает от Shopify.

Проблема в том, что когда страница изначально загружается, все элементы в модальном режиме загружаются, несмотря на то, что они скрыты. Это неоправданно замедляет работу сайта. Я хотел бы загрузить содержимое в модальном режиме только после того, как пользователь нажимает «Быстрый просмотр».

<div class="quick_shop"> <!--This is the modal trigger--> 
    <div class="quickview-text">Quick View</div> 
</div> 
<div class="modal"> 
    <!--All contents of the modal dialog window go in this div--> 
</div> 

Сценарий:

$('.quick_shop').leanModal(); //Calls the function on the modal trigger 
(function($){$.fn.extend({leanModal:function(_1)...});})(jQuery); 
//The above line of code is for leanModal. I didn't paste entire thing cause it's long 

Любая помощь будет высоко ценится! Я новичок и учился, поэтому все это очень интересно.

Answer 1

Целью модального div является точный просмотр одного конкретного элемента. В вашем случае (на веб-странице, которую вы предоставили), модальный загружается для каждого элемента, что нарушает смысл того, чего вы пытаетесь достичь.

Я никогда не использовал плагин leanModal, но я думаю, вы могли бы попробовать сделать следующее:

Когда «Быстрый просмотр» нажат, найти ближайший элемент с JQuery .closest() методом с помощью функции поиска элемента с классом .quick_shop, ТО leanModal, что один элемент и вывести его:

$(".quickview-text").on("click", function(e){ $(this).closest(".quick_shop").leanModal(); //Then display it with .show() if it's hidden by default }); 

После модальный закрыт вы можете удалить элемент вместо того, чтобы скрыть это с ИЗВЛЕКИТЕ JQuery в() метод.