페이드를 대체하기 위해 자바 스크립트에 무엇을 추가해야합니까?

Question

여기 내 자바 스크립트는 내가 이것을 사용할 때 두 번째 이미지의 불투명도를 높입니다. 두 번째 이미지가 페이드 인 할 때 첫 번째 이미지가 페이드 아웃되기를 원합니다. 코드에 무엇을 추가해야합니까? : 3

.b1 내 첫 번째 이미지는 내 두 번째 이미지

어떤 생각이 .b2이다?

$(document).ready(function(){ 

    $('.b2').animate({ 
     opacity:.0             
    }); 

    $('.b2').hover(function(){ 
     $(this).stop().animate({opacity:1});      
    }, function(){ 
     $(this).stop().animate({opacity:0});     
    }); 


}); 

나는이합니다 (.b2 스크립트의 반대.) 시도 내가 가짜 .b1 페이드에 추가해야 할 무엇

$('.b1').hover(function(){ 
     $(this).stop().animate({opacity:0});      
    }, function(){ 
     $(this).stop().animate({opacity:1});     
    }); 

. http://www.staygold-design.com 내 탐색에 롤러가 사라집니다. 첫 번째 이미지가 희미 해지기를 원합니다.

Answer 1

게시 한 코드의 첫 번째 블록을 작성하고 있습니다. 내가 본 것에서이 코드는 .b1 (애니메이션 측면에서)에 아무런 영향을주지 않습니다.

$(document).ready(function(){ 

$('.b2').animate({ 
    opacity:.0             
}); 

$('.b2').hover(function(){ 
    $(this).stop().animate({opacity:1}); 
    $(".b1").stop().animate({opacity:0});      
}, function(){ 
    $(this).stop().animate({opacity:0}); 
    $(".b1").stop().animate({opacity:1});    
}); 
}); 

오류가 발생하면 올바른 길을 찾아야합니다. .b2가 표시되면 .b1이 페이드 아웃됩니다. 사용자가 .b2 위로 마우스를 가져 가면 페이드 아웃되고 .b1이 페이드 인합니다.

.b2 불투명도를 0으로 초기화하는 호버 기능 외부의 애니메이션이 원하는 방식으로 작동하지 않을 수 있습니다. 페이지가로드되면 즉시 사라집니다. 0으로 애니메이션하는 대신 0으로 설정하는 것이 좋습니다.