在 WordPress 中包含一个 jQuery 插件答案

【问题标题】：Including a jQuery plugin inside of WordPress在 WordPress 中包含一个 jQuery 插件
【发布时间】：2013-08-30 02:37:17
【问题描述】：

我目前正在将我的 HTML 转换为 WordPress 网站。该站点使用'inview' jQuery 插件。

我似乎无法让它在 WordPress 中运行。

我在 header.php 中插入了插件链接：src="js/jquery.inview.js"

以及footer.php中的以下内容：

<script type="text/jscript">
$('#seoHomeImage, #socialBar').bind('inview', function(event, visible) {
if (visible) {
$(this).stop().animate({ opacity: 1 });
} else {
$(this).stop().animate({ opacity: 0 });
}
});
</script>

我也有这个来自 Chris Coyiers Blank 主题，在功能中：

if ( !is_admin() ) {
   wp_deregister_script('jquery');
   wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"), false);
   wp_enqueue_script('jquery');
}

我必须以某种方式在功能页面中链接“inview”插件吗？

感谢您的关注:-)

【问题讨论】：

是否有控制台输出。可能脚本加载的顺序搞错了。
我无法将此标记为重复，因为the other one in not accepted and doesn't have any upvotes。但答案与我在这里提供的完全相同。简而言之：不要取消注册 WP 捆绑的 jQuery 并使用正确的钩子将 jQuery 加入队列并添加为您自己脚本的依赖项。

标签： jquery wordpress jquery-plugins

【解决方案1】：

当 DOM 完成事件时，您应该将此代码放入 document.ready 部分

    $(function () {
        $('#seoHomeImage, #socialBar').bind('inview', function(event, visible) {
            if (visible) {
                $(this).stop().animate({ opacity: 1 });
            } else {
                $(this).stop().animate({ opacity: 0 });
            }
        });
    });

【讨论】：