Javascript 页面加载时显示featherlightbox弹出窗口

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

<?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>

jQuery（文档）.ready（函数（）{
$.featherlight（“mylightbox”）；
//控制台日志（“hi”）；
});
此div将在灯箱中打开

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

未捕获类型错误：无法读取未定义的属性“featherlight”

我需要你的帮助

---

谢谢。

似乎jQuery没有使用

$

-符号定义，因为

jQuery.（document）

有效

将

$.featherlight

更改为

jQuery.featherlight

，它应该可以工作

正如您在评论中所问的，您可以通过在该div上添加css属性：

display:none

来隐藏该div

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

---

这将在调用

$.featherlight（#mylightbox“）的
脚本之前加载
featherlight.js
插件如何？抱歉这个愚蠢的问题。请向我们显示您的脚本加载部分，或者完整的页面，以便正确分析。
$
未定义，这就是为什么您使用
jQuery（文档）
而不是
$（文档）
。要修复未定义的问题，请尝试将
$.featherlight
更改为
jQuery.featherlight
。谢谢Magnus。另一个与此相关的问题。如何隐藏div，因为我可以在页面底部看到div。
$.featherlight($('#mylightbox'), {});