jQuery의 fadeIn() 메서드는 선택한 요소의 불투명도를 숨김에서 표시로 변경하는 데 사용됩니다.
구문
구문은 다음과 같습니다 -
$(selector).fadeIn(speed,easing,callback)
예시
위의 속도는 페이딩 효과의 속도입니다. 이징은 다양한 애니메이션 지점에서 속도에 대해 스윙 또는 선형일 수 있습니다. 콜백은 메소드가 완료된 후 실행되는 함수입니다.
이제 jQuery fadeIn() 메소드를 구현하는 예를 살펴보겠습니다 -
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".btnout").click(function(){
$("div").fadeOut();
});
$(".btnin").click(function(){
$("div").fadeIn();
});
});
</script>
</head>
<body>
<h2>Java</h2>
<div>
<p>Java released in 1994. The current version is Java 13.</p>
</div>
<button class="btnout">Fade out</button>
<button class="btnin">Fade in</button>
<p>Click on above buttons to fade out and fade in text.</p>
</body>
</html> 출력
이것은 다음과 같은 출력을 생성합니다 -
텍스트를 페이드 아웃하려면 위의 "페이드 아웃" 버튼을 클릭하십시오 -
텍스트를 페이드 인(표시)하려면 위의 "페이드 인" 버튼을 클릭하세요.
