[CSS]ヘッダをホバーするとナビゲーションがスライド表示されるスタイルシート（スクリプト無し）

スクリプトを使わずに、ヘッダをホバーすると非表示だったナビゲーションがアニメーションで表示させるスタイルシートのテクニックを紹介します。 デモページのアニメーション 通常時は細めのヘッダとコンテンツがあるだけで、ヘッダをホバーすると、非表示だったナビゲーションがアニメーションでスライドして表示されます。 デモのようなナビゲーションだけでなく、他のコンテンツを設置することももちろん可能です。 実装 Step 1: HTML ヘッダ部分は最初に表示されている要素、非表示の要素の2つが配置されています。 <div id="topbar"><a href="http://designshack.net">Back to Design Shack</a> <div id="tophiddenbar"> Other Links: <a href="http://designshack.net/cate

[nors]

http://designshack.net/articles/css/create-a-hidden-sliding-navigation-bar-using-css3-transitions/