jQuery में fadeIn() मेथड का उपयोग चयनित तत्वों की अस्पष्टता (opacity) को छिपे हुए से दृश्यमान में बदलने के लिए किया जाता है।
सिंटैक्स
सिंटैक्स इस प्रकार है:
$(selector).fadeIn(speed, easing, callback)
उदाहरण
यहाँ, speed फेडिंग प्रभाव की गति है। easing स्विंग या रैखिक (linear) हो सकता है विभिन्न एनिमेशन बिंदुओं पर गति के लिए। 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>
आउटपुट
यह निम्नलिखित आउटपुट उत्पन्न करेगा:
ऊपर दिए गए "Fade out" बटन पर क्लिक करके टेक्स्ट को फेड आउट करें:
अब ऊपर दिए गए "Fade in" बटन पर क्लिक करके टेक्स्ट को फेड इन (प्रदर्शित) करें:
