jquery - jquery悬停标签，底部和顶部行，共享中央容器

Question

希望你好！

我这里有一个小项目要解决...

…我一直在玩并在这里设置了一个 jsfiddle 来说明所需的目标…</p>

...我已将标签元素定位在顶部和底部...顶部标签为绿色，底部标签为红色...</p>

...底部的红色标签行需要是不同的 CSS 类，因为我需要对它们应用不同的图形...</p>

..我有一个小提琴，但不确定绑定它以适应顶行选项卡的“moving_bg”类……和底行的“moving_bg-B”类。

…基本上是 8 个 UL 内容块，需要共享该中央容器：

…正如我们所见，我们应用了正确的 html 结构和 css，但是当使用底行选项卡时，UL 块不会滑过 UL 块编号 4。

...作为一个 jquery noob 任何帮助，非常感谢指针！

score 0 · Accepted Answer

问题是这样的：

   var background = $(this).parent().find(".moving_bg");

您只为一个类编写了动画，.moving_bg这是您的顶部选项卡，因此动画效果很好。您的底部选项卡具有.moving_bg-B类，因此没有为该类放置动画。

如果要同时使用顶部和底部选项卡动画，则需要使用两个类的联合。

 var background = $(this).parent().find(".moving_bg,.moving_bg-B");

在上面的代码中，我正在合并两个类。

为您更新 JSfiddle：http: //jsfiddle.net/AMCBP/2/

1 回答 1