A CodePen by Bobby. Indonesia Waving Flag - Simple demonstration using css3 animation with nth-child selectors.

index.html

<ul>
  	<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
	</ul>
	<ul class="white">
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
		<li><div></div></li>
	</ul>

script.js

/*  
Indonesia Waving Flag
  	
01/09/12

UPDATE!
24/12/2012 : change the html background. 
*/

style.css

*{margin: 0;padding: 0;}

    html{
			min-height: 100%;
			background-image: -webkit-radial-gradient(mintcream 0%, grey 100%);
		}

		body{padding-top: 50px;}

		ul{
			list-style: none;
			display: table;
			margin: 0 auto;
		}

		ul li{float: left;}

		div{
			width: 10px;
			height: 50px;
			background: rgba(200,0,0,1);
			margin: 0 0px 0 0;
			position: relative;

			-webkit-animation: merah 2s ease-in-out infinite;
		}

		.white{position: relative;}
		
		.white div{
			background: rgba(230,230,230,1);
			-webkit-animation: putih 2s ease-in-out infinite;
		}

		.white:before{
			content: '';
			position: absolute;
			
			width: 15px;
			height: 400px;
			top: -70px;
			left: -15px;
			z-index: -2;

			background-image: -webkit-linear-gradient(0deg, #cbcbcb 0%, #ebebeb 30% ,#ebebeb 70%, #cbcbcb 100%);
			border-radius: 5px 5px 0 0;
		}

		.white:after{
			content: '';
			position: absolute;

			width: 80px;
			height: 20px;
			bottom: -300px;
			left: -48px;

			background-image: -webkit-linear-gradient(0deg, #373737 0%, #5b5b5b 30% ,#5b5b5b 70%, #373737 100%);
			border-radius: 5px 5px 0 0;
		}

		@-webkit-keyframes putih{
			0%{
				top:0;
				background: rgba(230,230,230,1);
			}
			50%{
				top:-20px;
				background: rgba(250,250,250,1);
			}
			100%{
				top:0;
				background: rgba(230,230,230,1);
			}
		}

		@-webkit-keyframes merah{
			0%{
				top:0;
				background: rgba(180,0,0,1);
			}
			50%{
				top:-20px;
				background: rgba(220,0,0,1);
			}
			100%{
				top:0;
				background: rgba(180,0,0,1);
			}
		}

		ul li:nth-child(2n) div{
			-webkit-animation-delay: 0.1s;
		}

		ul li:nth-child(3n) div{
			-webkit-animation-delay: 0.2s;
		}

		ul li:nth-child(4n) div{
			-webkit-animation-delay: 0.3s;
		}

		ul li:nth-child(5n) div{
			-webkit-animation-delay: 0.4s;
		}

		ul li:nth-child(6n) div{
			-webkit-animation-delay: 0.5s;
		}

		ul li:nth-child(7n) div{
			-webkit-animation-delay: 0.6s;
		}

		ul li:nth-child(8n) div{
			-webkit-animation-delay: 0.7s;
		}

		ul li:nth-child(9n) div{
			-webkit-animation-delay: 0.8s;
		}

		ul li:nth-child(10n) div{
			-webkit-animation-delay: 0.9s;
		}

		ul li:nth-child(11n) div{
			-webkit-animation-delay: 1s;
		}

		ul li:nth-child(12n) div{
			-webkit-animation-delay: 1.1s;
		}

		ul li:nth-child(13n) div{
			-webkit-animation-delay: 1.2s;
		}

		ul li:nth-child(14n) div{
			-webkit-animation-delay: 1.3s;
		}

		ul li:nth-child(15n) div{
			-webkit-animation-delay: 1.4s;
		}

		ul li:nth-child(16n) div{
			-webkit-animation-delay: 1.5s;
		}

		ul li:nth-child(17n) div{
			-webkit-animation-delay: 1.6s;
		}

		ul li:nth-child(18n) div{
			-webkit-animation-delay: 1.7s;
		}

		ul li:nth-child(19n) div{
			-webkit-animation-delay: 1.8s;
		}

		ul li:nth-child(20n) div{
			-webkit-animation-delay: 1.9s;
		}

		ul li:nth-child(21n) div{
			-webkit-animation-delay: 2s;
		}