Basically the fading is the appearing and disappearing the content or section gradually. While toggle means if already appeared then set it to fade out and similarly if already not appeared then appear it with fade in. We mostly perform toggling with button click.
$("TagSelector").fadeToggle("OptionalTimeParameter"); // Syntax
$("#mydiv").fadeToggle("slow"); // Example
Lets discuss full detail example that we show that how actually the toggle fading works.
We will call a jQuery fade Toggle function on button click and fade in and out the div section with id="mydiv".
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mydiv">
You are at the CodingPK jQuery Fade Toggle tutorial.
Just follow the Chapter Sequence to learn jQuery programming.
</div>
<button id="mybutton">Click Me to Toggle Div Fading</button>
<script type="text/javascript">
$("#mybutton").click(function(){
$("#mydiv").fadeToggle("6000");
});
</script>
Note ! fadeIn() , fadeOut() , fadeToggle() functions parameter is optional , you can pass null value or time value. For example