Question

我试图让Wordpress网站上的类别和档案侧边栏部分（http://stoganews.com/）仅在悬停时显示，使用jQuery＆＃39; s .slideToggle()。

以下是“类别”列表中的相关HTML。档案列表具有完全相同的结构。

<div class="catlist">
 <ul class="cats-list">
  <li>
   <h2><a href="#">CATEGORIES</a></h2>
   <ul class="list-alt">
    <li class="cat-item cat-item-71">
     <a href="http://stoganews.com/?cat=71" title="View all posts filed under Arts &amp; Culture">Arts &amp; Culture</a> (28)
    </li>
    <li class="cat-item cat-item-130">
     ...

这是我正在使用的Javascript，expand.js。

jQuery('.catlist').each(function(){
   // hides Categories section, Archives section
   jQuery('.list-alt',this).hide();

   // show section when hovered over
   jQuery(this).hover(function(){
      jQuery(this).find('.list-alt').toggle();
   });
});

正如您从网站上看到的，代码目前适用于toggle()。但是，当我用slideToggle()代替toggle()时，这些部分永远不会隐藏，当它们悬停时没有任何反应。为什么呢？

我确保避免的问题：

确实包含了jQuery。它在源代码中显示为<script type='text/javascript' src='http://stoganews.com/wp-includes/js/jquery/jquery.js?ver=1.6.1'></script>。
据我所知，我没有使用固定面板，这些面板无法动画。
我使用jQuery()代替$() - 这是Wordpress的限制。

P.S。关于stackoverflow的第一个问题！

Answer 1

我创建了jsfiddle for this它似乎有效。他们没有jquery 1.6.1，演示使用1.6.4。我确实需要在javascript的第一行更改jQuery('.catlist')到jQuery('.cats-list')，这可能是阻止它工作的原因。

在Wordpress类别上使用jQuery的.slideToggle（）

1 个答案: