Question

我会说实话。我没有wordpress php编码的经验，但我可以使用wordpress管理员进行简单的调整。现在我遇到了问题。我用过羽毛灯箱js。我有一个代码，下面显示了页脚的一部分。

<?php if ( is_front_page() ) :  ?>

<script>

    jQuery(document).ready(function() {


    $.featherlight("#mylightbox");
        //console.log("hi");



    });

</script>

 <?php endif; ?>



 <?php wp_footer(); ?>

 <a href="#" data-featherlight="#mylightbox">Open element in lightbox</a>
 <div id="mylightbox">This div will be opened in a lightbox</div>

 </body>

这样，当我点击锚标签时，poplightbo会弹出。但我想要做的是让羽毛灯箱在页面加载时打开它。正如你在我的代码中看到的，那里有一个部分说如果front_page也有就绪功能。它返回错误

未捕获的TypeError：无法读取属性＆＃39; featherlight＆＃39;未定义的

我需要你的帮助。

感谢。

Answer 1

似乎jQuery没有使用$ - 符号定义，因为jQuery.(document)有效。

将$.featherlight更改为jQuery.featherlight，它应该有效。

正如您在评论中提到的那样，您最初可以通过在该div上添加css属性display: none来隐藏div。

Answer 2

<div id="mylightbox">Text to display in box</div>

对于此弹出窗口，请使用脚本

$.featherlight($('#mylightbox'), {});

这将有效

显示在页面加载时弹出featherlightbox

2 个答案: