jquery css3平滑的淡出淡进导航菜单特效

jquery css3平滑的淡出淡进导航菜单特效演示图：

代码：

<div class="container">
	<ul id="topnav">
		<li><a href="http://www.lol9.cn/" class="home">Home</a></li>
		<li>
			<a href="http://www.lol9.cn/" class="products">Products</a>
			<div class="sub">
				<ul>
					<li><h2><a href="http://www.zcool.com.cn/">六久阁</a></h2></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
				</ul>
				<ul>
					<li><h2><a href="http://www.zcool.com.cn/works/">原创作品</a></h2></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
				</ul>
				<ul>
					<li><h2><a href="http://www.lol9.cn/">Accessories</a></h2></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
				</ul>
				<ul>
					<li><h2><a href="http://www.lol9.cn/">Accessories</a></h2></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
				</ul>
			</div>
		</li>
		<li>
			<a href="http://www.lol9.cn/" class="sale">Sale</a>
			<div class="sub">
				<div class="row">
					<ul style="width:225px;">
						<li><h2><a href="http://www.lol9.cn/">Deal of the Week</a></h2></li>
						<li><a href="http://www.lol9.cn/">Navigation Link - 2 Column</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link - 2 Column</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link - 2 Column</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link - 2 Column</a></li>
					</ul>
					<ul style="width:225px;">
						<li><h2><a href="http://www.lol9.cn/">Clearance Items</a></h2></li>
						<li><a href="http://www.lol9.cn/">Navigation Link - 2 Column</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link - 2 Column</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link - 2 Column</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link - 2 Column</a></li>
					</ul>
				</div>
				<div class="row">
					<ul>
						<li><h2><a href="http://www.lol9.cn/">Deal of the Week</a></h2></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					</ul>
					<ul>
						<li><h2><a href="http://www.lol9.cn/">Clearance Items</a></h2></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					</ul>
					<ul>
						<li><h2><a href="http://www.lol9.cn/">Open Box Items</a></h2></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
						<li><a href="http://www.lol9.cn/">Navigation Link</a></li>
					</ul>
				</div>
			</div>
		</li>
		<li><a href="http://www.lol9.cn/" class="community">Community</a></li>
		<li><a href="http://www.lol9.cn/" class="store">Store Locator</a></li>
	</ul>
</div>