클릭 섹션에서 페이드 인하다가 페이드 아웃

Question

fullContent jQuery 플러그인 (link)을 기반으로 한 페이지 스타일의 웹 사이트를 운영합니다. 필요한 섹션으로 스크롤하여 스크롤 할 때의 탐색 링크. HTML의
구조 :

<div id="container"> 
    <div id="section1"></div> 
    <div id="section2"></div> 
    <div id="section3"></div> 
</div> 

jQuery를 사용하여, 나는 section2을 통해 오버레이에 페이드하려고합니다. 이는 viewport plugin 덕분입니다. 지금까지 코드는 다음과 같다 : 지금 어떤 애니메이션이 없기 때문에

if ($('#section2 tr:in-viewport')) { 
      $('#section2').css('background-color', 'rgba(171, 205, 239, 0.5)'); 
}; 

나는 0.5 초 후 시작 전환, 같은 오버레이를 받고 투쟁, - 오버레이는 순간이다. 따라서 일단 사용자가 다른 섹션으로 이동하면 section2을 어떻게 사라지게 할 수 있습니까? 저는 jquery의 초보자입니다. 올바른 구문에 대해서는 확실하지 않습니다. 미리 감사드립니다.

EDIT : 내가 잘못 타겟팅하고 있습니다. 이게 뭐가 잘못 되었 니?

$('#section2:in-viewport').each(function() { 
$('#section2').css('background-color', 'rgba(171, 205, 239, 0.5)'); 
}); 

Answer 1

당신은 fadeIn() 기능과 동일한 효과를 얻을 수 있습니다. 참고로, 바로 앞에 hide()를 실행하고 싶을 수도 있습니다.

Answer 2

웹 사이트에 대한 귀하의 설명이 명확하지 않습니다. 그러나 2 절로 이동하는 경우 이전 답변을 기반으로 한 예가 있습니다

$('#section2:in-viewport').each(function() { 
    $('section').hide();       //hide all sections 
    $('#section2').fadeIn();      //fade in target section 
    $('#section2').css('background-color', 'rgba(171, 205, 239, 0.5)'); //this should probably just be in your CSS file 
});