Column Index Navigation
縦ナビのホバーで小さな番号レールが伸び、メニューが連続した流れで移動する。
PRACTICAL WEB TIPS
Hover Effects
実際に動くWeb制作素材。プレビューで試して、HTML・CSSコードを確認できます。
使用対象から探す
ボタン・テキスト・画像など、実際に使う場所で分類しています。
適用中：使用対象: navigation ／ 動き: slide
25 items条件に一致する公開素材
Tabbed Color Guide
メニュー項目へホバーすると色帯と補足ラベルが同時に動くタブバー。
Breadcrumb Route Highlight
パンくずの各段階へホバーすると、現在地までの経路と該当階層が強調されます。
Sidebar Editorial Tabs
縦型のサイドナビにホバーすると内容ラベルと小見出しが展開する。
Nested Menu Reveal
親メニューにホバーすると、階層サブメニューと補助情報が横に展開する小型ナビゲーション。
Chapter Label Rail
記事内ナビの省スペースな章番号がホバーで見出しラベルに展開するインデックス。
Museum Exhibit Menu
展示案内の各リンクに触れると矢印と展示番号が別方向から現れる、ミュージアム向けのナビ。
Neighbor-Dim Navigation
メニュー項目をホバーすると隣接項目が静かに薄まり、アクティブな項目だけにラインが伸びる。
Context Preview Rail
メニューの各リンクに触れると、右側の共通レールにその項目固有のプレビュー情報が切り替わる。
Shortcut Hint Navigation
メニューの末尾にショートカットキーのヒントがせり出す、管理画面向けナビゲーション。
Tabular Chapter Nav
章番号と見出しが上下のラインで切り替わる、編集記事のセクション移動ナビゲーション。
Inline Map Marker Links
会社案内の拠点リンクにホバーすると小さなピンと距離メモが展開するナビゲーション。
Pagination Leaf Turn
ページ番号が小さくめくれるように切り替わる、記事一覧やギャラリー用ページ送り。
Dot-To-Label Nav
縦に並ぶ小さなドットがホバー時に短い見出しへ展開する、ページ内ナビゲーション用のUI。
Stacked Destination Menu
ナビ項目の裏に重なった行き先ラベルがホバー時に段差を付けて現れる。
Axis Rail Menu
縦の座標軸に沿って短い横線がスライドし、選択中メニューを正確に指し示す。
Crosshair Navigation Mark
メニュー項目の四隅から短いクロスヘア線が入り、現在注目している項目を示す。
Nav Overline Connector
企業サイトのナビゲーションで、ホバーした項目の上側ラインと矢印が連動して現れる。