<!DOCTYPE html>    
    <html>    
    <head>  
    <style>
	#fade1, #fade2, #fade3{width:200px;height:300px;background:#000;}
	</style>	
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>    
    <script>    
    $(document).ready(function(){    
      $("button").click(function(){    
        $("#fade1").delay("fast").fadeIn();    
        $("#fade2").delay("slow").fadeIn();    
        $("#fade3").delay(3000).fadeIn();   
    });    
    });    
    </script>    
    </head>    
    <body>    
    <p>This example sets different speed values for the delay() method.</p>    
    <button>Click to fade in boxes with a different delay time</button>    
    <br><br>    
    <div id="fade1"></div>    
    <div id="fade2"></div>   
    <div id="fade3"></div>   
    </body>    
    </html>    
Your Answer
Login
Enter email and password to comment or answer
Not the answer you are looking for? Browse other questions tagged or ask your own question.