다른 이미지와 페이드 인/아웃 배경 이미지/다른 요소를 페이드 아웃

Question

일부 요소의 페이드 인/아웃에 문제가 있습니다. 나는 새로운 diva를 가질 필요가있다. 새로운 배경으로 사라지게 될 것이다. 나는 또한 그 요소 위에 얹혀있는 동안 다른 divs가 일부를 페이드 아웃해야합니다.

요소 위로 마우스를 가져 가면 다른 요소가 사라질 수 있지만 나머지 문제는 알 수 없습니다.

페이지에 다른 div (ID 및 클래스)가있는 경우에만 해당 div가 영향을 받기를 원합니다. 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

덕분에, 나는 작업을 수행하는 방법에, 한 걸음 더 나아가 그것을했다 배경 "변경"첫 번째 배경을 포함하는 div에 div (새로운 배경 포함)를 삽입하고 이전 div에 대해 새로운 div를 페이드 인/아웃시킵니다. 두 번째 div는 bg가 서로 오프셋되어야하는 효과를 얻으려고하지 않는 한 원본과 동일한 "차원"이어야합니다.

는 현재 업데이트 된 코드를 볼 수 있습니다 http://jsfiddle.net/deelite/SnvMr/12/

JS 코드 :

$('.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); 
}); 

감사합니다!

Answer 2

그냥 .not(this)을 사용하십시오. .not($(this))이 잘못되었습니다. 또한 몇 가지 다른 오류가 있습니다. 효과를 적용하려는 div에 다른 클래스 (예 : .effect)를 추가하기 만하면됩니다.

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); 
    } 
); 

바이올린 : 코드에 대한 자신의 도움을 Mooseman에 http://jsfiddle.net/SnvMr/5/