CSSだけで作られた、フリップで3D風に回転するエフェクト付きドロップダウンメニューです。デスクトップでは、hoverするとエフェクトが発動し、90度後ろに回転したように見えます。また、メニュータイトルの下部分に下矢印があるものは、子メニューがあり、そこへhoverすると、今度は色を変えて横向きに回転します。「Widgets」の子メニューは右回転、「Kabobs」の子メニューは左回転です。

サンプルのhtmlソース

<nav class="menu">
	<ol>
		<li class="menu-item"><a href="#0">Home</a></li>
		<li class="menu-item"><a href="#0">About</a></li>
		<li class="menu-item"><a href="#0">Widgets</a>
			<ol class="sub-menu">
				<li class="menu-item"><a href="#0">Big Widgets</a></li>
				<li class="menu-item"><a href="#0">Bigger Widgets</a></li>
				<li class="menu-item"><a href="#0">Huge Widgets</a></li>
			</ol>
		</li>
		<li class="menu-item"><a href="#0">Kabobs</a>
			<ol class="sub-menu">
				<li class="menu-item"><a href="#0">Shishkabobs</a></li>
				<li class="menu-item"><a href="#0">BBQ kabobs</a></li>
				<li class="menu-item"><a href="#0">Summer kabobs</a></li>
			</ol>
		</li>
		<li class="menu-item"><a href="#0">Contact</a></li>
	</ol>
</nav>