javascript - 带有Wordpress的jQuery PowerTip麻烦

让PowerTip插件在新的WP网站上工作时遇到很多麻烦。该网站已关闭以进行开发，但我会尽量具体。希望我错过了一些简单的事情，因为这似乎是一个很棒的插件。

脚本jquery.powertip.js已上传到我主题的JS目录。
css文件jquery.powertip.css已上传到我主题的css目录。

我在正上方的标题中调用脚本：

<link rel="stylesheet" href="css/jquery.powertip.css">
<script src="js/jquery.powertip.js"></script>
</head>

我也尝试过直接http链接或相对链接，但这没什么不同。这是我正在测试插件的img片段的示例。

<img class="productImage" src="/wp-content/uploads/2015/03/cow.png" title="This is a test">

我已将以下功能添加到main.js文件中，如下所示：

$('.productImage').powerTip({
    placement: 'ne' // north-east tooltip position
});

我还按照插件文档的建议将此添加到我的主要css文件中：

#powerTip {
    position: absolute !important;
    display: none !important;
    z-index:2147483647 !important;
}

如果有人可以帮助我，我将非常感激。这是github插件的链接：jQuery PowerTip: GitHub

最佳答案

1）您必须正确地将Javascript放入WordPress主题中，以便在主jQuery库之后正确加载它并以无冲突模式加载它。有关如何使用wp_enqueue_script的详细信息，请参见Function Reference/wp enqueue script « WordPress Codex；请参见示例，例如jquery.powertip.js：

function theme_load_scripts() {
    wp_enqueue_script( 'jquery.powertip.js', get_template_directory_uri() . '/jquery.powertip.js', array(), '1.0.0', true );
}

add_action( 'wp_enqueue_scripts', 'theme_load_scripts' );

该函数位于主题的functions.php中；脚本init $（'。productImage'）。powerTip ...放在header.php中

2）了解如何在Firefox中使用Firebug，或使用Chrome或Safari或IE中的开发人员工具查看网站上正在加载的javascript以及任何错误。控制台将显示加载工具提示脚本时是否仍然存在JavaScript错误或其他冲突，以向您显示。

3）可以将CSS添加到主样式表中；或者，按照与上述相同的原理使用http://codex.wordpress.org/Function_Reference/wp_enqueue_style将自定义CSS保留在单独的样式表中。

 function theme_load_style() {
        wp_enqueue_style( 'style-name', get_stylesheet_uri() );
    }

    add_action( 'wp_enqueue_scripts', 'theme_load_style' );

关于javascript - 带有Wordpress的jQuery PowerTip麻烦，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28933756/