Last updated on February 15th, 2022 at 09:53 am
This tutorial will show you how to implement FADE IN and FADE OUT effect using simple JQUERY script. Here we are just defining and element with an id FadeInOut and then fadeIn() and fadeOut() function available in jQuery to implement the effect.
<script src="http://mistonline.in/wp/demo/jquery-1.2.3.min.js" type="text/javascript">
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#FadeOut").click(function () {
$("#FadeInOut").fadeOut(3000);
});
$("#FadeIn").click(function () {
$("#FadeInOut").fadeIn(3000);
});
});
</script>
<button id="FadeOut">Fade Out</button> <button id="FadeIn">Fade In</button>
<p id="FadeInOut">This line will FADE In and FADE out once you press the above buttons</p>
Excellent and short tip for jquery fade in and fade out.
Thumb up