Advanced Search

Return to Snippet

Revision: 65931
at February 11, 2014 10:39 by winthropite
Initial Code 
<html>
<head>
<title>Fade</title>
<style type="text/css">
#fade {
	margin: 0 auto;
	height: 200px;
	width: 200px;
	background-color: purple;
}
</style>
</head>
<body>

<div id="fade">
</div>

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript">

$(function() {
    
	var opacity = 0;

	var interval = setInterval(function() {
		opacity += .1;

		$('#fade').css('opacity', opacity);

		if (opacity === 1) {
			clearInterval(interval);
		}
	}, 50);


});

</script>

</body>
</html>
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    
A quick demonstration of fading an element in over a set time by starting opacity at 0 and incrementing it + .1 over time.

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
jQuery element opacity fade in over time (without fadeIn();)

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
jquery

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
jQuery