Animated background repeat-x

Clouds background animated

by Roberto Apasajja

HTML

<div id="animate-area"></div>

CSS

@keyframes animatedBackground {
	from { background-position: 0 0; }
	to { background-position: 100% 0; }
}
#animate-area	{ 
	width: 100%; 
	height: 400px; 
	background-image: url(http://davidwalsh.name/demo/bg-clouds.png);
	background-position: 0px 0px;
	background-repeat: repeat-x;

	animation: animatedBackground 40s linear infinite;
}