Question

实际上，我遇到了弹出模式花式框问题，其中弹出窗口未正确加载内容。默认情况下，模式div不显示任何内容。而且我需要在点击事件中显示该模式。

我正在使用包含此功能的AfterPAy付款方式模块。当我们单击了解更多按钮时，将打开弹出窗口，但未打开该精美框中的内容。我需要使其完美。这是我的网站URl https://www.tradie.com/tradie-honey-badger-sports-mid-length-trunk-1371.html

(function($) {

    $(document).on('ready', function() {
        $('.afterpay-what-is-modal-trigger').fancybox({
			  afterLoad: function() {
                $('#afterpay-what-is-modal').css("display", "block");
            }
            afterShow: function() {
                $('#afterpay-what-is-modal').find('.close-afterpay-button').on('click', function(event) {
                    event.preventDefault();
                    $.fancybox.close();
                })
            }
        })
    });

})(jQuery);

以上js代码在扩展名为modal.js的文件中。在这里，aftershow功能正常运行，但后负载无效。请问该模式将如何正确显示内容。

谢谢。

Answer 1

根据关注点，有一个内联设置为不显示的div。因此，当您点击链接/按钮时，由于该内联CSS，模态将变为空白。

请找到模式文件的html，并在该代码的顶部添加一个额外的div，然后将display inone设置为indiv。例如，

<div style="display:none;">
  <div id="afterpay-what-is-modal">
    <!--some modal code for popup-->
  </div>
</div>

在之前添加一个div并设置其样式以使其内联显示。

希望这对您有用。

无法在magento1中正确加载Fancybox模式弹出窗口内容？

1 个答案: