Question

我遇到了fadein / out of some elements的问题。我需要有几个div，在新的背景中淡入淡出，以及在它悬停时的文本。我还需要让其他div淡出一些，而我却在那个元素上盘旋。

如果我在一个元素上盘旋，我可以淡出其他元素，但问题的其余部分我无法弄明白。

我只想让那些特定的div受到影响，因为我在页面上有其他div（id和class）。

这是我的小提琴： http://jsfiddle.net/deelite/SnvMr/2/

我的jquery：

$('div').hover(function() {
  $('div').not($(this)).stop().fadeTo(500, 0.33);
  }, function() {
  $('div').stop().fadeTo(500, 1);
});

我不确定如何继续。

Answer 1

只需使用.not(this); .not($(this))不正确。你还有其他一些错误。您只需将另一个类（例如.effect）添加到要应用效果的div即可。

HTML：

<div class="effect one"><p>me</p></div>
<div class="effect two"><p>have</p></div>
<div class="effect three"><p>fun</p></div>

jQuery的：

$('.effect').hover(
    function() {
        $('.effect').not($(this)).stop().fadeTo(500, 0.33);
    }, function() {
        $('.effect').stop().fadeTo(500, 1);
    }
);

小提琴：http://jsfiddle.net/SnvMr/5/

Answer 2

感谢Mooseman对代码的帮助，我更进了一步，关于如何通过在包含第一个背景的div中插入div（包含新背景）来进行背景“更改”，以及有新的div淡出/淡出旧的。第二个div必须与原始div具有相同的“尺寸”，除非你想要的是bg必须相互抵消的效果。

您可以在此处查看更新的代码： http://jsfiddle.net/deelite/SnvMr/12/

JS CODE：

$('.effect').hover(
function () {
    $('.effect').not(this).stop().fadeTo(500, 0.33);
    $(this).find('div').stop().fadeTo(500, 1);
}, function () {
    $('.effect').stop().fadeTo(500, 1);
    $('.effect div').stop().fadeTo(500, 0);
});

谢谢！

使用其他图像淡入/淡出背景图像/淡出其他元素

2 个答案: