javascript - 淡出悬停div上的其他div

我试图弄清楚如何淡出所有的div，但正在徘徊。到目前为止，这是我的代码，我只能让它淡出被悬停的代码，而不是让所有未悬停的代码消失。

$(document).ready(function () {

    $('.fadeHover').hover(

    function () {
        $(this).stop().fadeTo('slow', 0.3);
    },

    function () {
        $(this).stop().fadeTo('slow', 1);
    });
});

<div class="fadeHover fadeDiv">
    <p>1</p>
</div>
<div class="fadeDiv fadeHover">
    <p>2</p>
</div>
<div class="fadeDiv fadeHover">
    <p>3</p>
</div>

最佳答案

检查此fiddle

您可以简单地通过使用jquery not()选择器来完成此操作，然后跟随this

$('.fadeHover').hover(
   function () {
    $('.fadeHover').not(this).fadeTo('slow', 0.3);
   },
    function () {
    $('.fadeHover').fadeTo('slow', 1);
});