jQuery 效果在 Wordpress 模板文件中不起作用

jQuery effect not working in Wordpress template file?

本文关键字：文件 不起作用 Wordpress jQuery      更新时间：2023-09-26

我有主页的模板文件，主页模板.php，其中我有一个滑动菜单html。

这是我的滑动菜单脚本：

$(document).ready(function() {
// Expand Panel
$("#open").click(function(){
    $("div#panel").slideDown("fast");

}); 
// Collapse Panel
$("#close").click(function(){
    $("div#panel").slideUp("fast"); 
});     
$(".toggle a").click(function () {
    $(".toggle a").toggle();
});     
  e.preventDefault();
 });

并且jQuery和此脚本都加载到页面上，但幻灯片效果不起作用，它只是上下弹出而没有效果。

有什么帮助吗？

这是 HTML 代码：

<div id="panel">    
<nav id="main-menu">
    <ul>
      <li><a href="">Home</a></li>
      <li><a href="">About me</a></li>        
    </ul>
</nav>
</div>
<div class="toggle"><a id="close" style="display: none;position:   absolute;right:5px;top:5px;" class="close" href="#"></a></div>   
<div class="toggle" style="position: absolute;right:10px;top:10px;"><a id="open"    class="open" href="#"></a></div>

这是一个页面的链接：http://pavlovic.com/about-me/

好吧，一方面没有定义 e，其次我不确定你是如何包含你的 js 所以你应该阅读这个： http://wp.tutsplus.com/articles/how-to-include-javascript-and-css-in-your-wordpress-themes-and-plugins/

请尝试以下对我有用的代码

$(this).effect('slide', { direction: 'down'}, 500);

为了使幻灯片效果与jQuery文件一起在WordPress中工作，还必须加载jquery-effects-core和jquery-effects-slide。

wp_enqueue_script('jquery');
wp_enqueue_script('jquery-ui-core');
wp_enqueue_script('jquery-effects-slide');

此代码也有效：

$('#test').effect( "slide", "right" );
相关文章：