fadein
English [feɪ'dɪn] American [feɪ'dɪn]
n. Gradually brighten, gradually appear
jquery fadeIn() method syntax
Function: fadeIn() method uses the fade-in effect to display the selected element if the element is hidden.
Syntax: $(selector).fadeIn(speed,callback
Parameters:
| Parameter | Description |
| speed | Optional. Specifies the speed of the element from hidden to visible. The default is "normal" .Possible values: milliseconds (e.g. 1500) "slow" "normal" "fast" With the speed set, the element will gradually change its transparency as it goes from hidden to visible (this will create a fade-in effect). |
| callback | Optional. The function to be executed after the fadeIn function is executed. To learn more about callback, please visit our jQuery Callback Chapter. This parameter cannot be set unless the speed parameter is set. |
Note: If the element is already displayed, this effect will not produce any change. Unless a callback function is specified. This effect applies to elements hidden through jQuery, or elements declared with display:none in CSS (but not elements with visibility:hidden).
jquery fadeIn() method example
<html>
<head>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
$("p").fadeOut()
});
$(".btn2").click(function(){
$("p").fadeIn();
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button class="btn1">Hide</button>
<button class="btn2">Show</button>
</body>
</html>Click the "Run instance" button to view the online instance