javascript - 将两个单独的元素附加到一个动画脚本

Question

我试图让一个 div 通过将鼠标悬停在它上面来改变它的宽度。我已经怀疑了，但我也希望通过悬停一个单独的 h5 标签来改变它的宽度。有谁知道如何做到这一点？这是我目前拥有的。

$(function(){
$("#hoverbox").hover(
    function(){
       $(this).animate({width: '150px'});
    },
    function(){
        $(this).animate({width: '38px'});
    }
);
}};

https://jsfiddle.net/m0u8braj/5/ ... 或者它位于 http://www.cosmosdesign.co.nz/ .您可能还会注意到盒子会有点痉挛并展开和缩回无数次，这是否与我当前的代码有关？谢谢。

Answer 1

我已经编辑了你的 Fiddle .它现在只用 CSS 做你想做的事。不需要 jQuery 的 .animate()

它是这样工作的，因为 CSS 的 :hover 可以影响带有 + 或 ~ 选择器的兄弟元素，如下所示:

#hoverbox:hover, h5:hover + #hoverbox{
  width: 150px;
}

希望对你有帮助