JavaScript Tutorial

.fadeToggle()

<!DOCTYPE html>  
<html>  
<head>  
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>  
    <script>  
    $(document).ready(function(){  
        $("button").click(function(){  
            $("#div1").fadeToggle();  
            $("#div2").fadeToggle("slow");  
            $("#div3").fadeToggle(3000);  
        });  
    });  
    </script>  
</head>  
<body>  
    <p>See the fadeToggle() method example with different parameters.</p>  
    <button>Click to fade Toggle boxes</button><br><br>  
    <div id="div1" style="width:80px;height:80px;background-color:red;"></div><br>  
    <div id="div2" style="width:80px;height:80px;background-color:green;"></div><br>  
    <div id="div3" style="width:80px;height:80px;background-color:blue;"></div>  
</body>  
</html>