マルチボックスのフルスクリーンメニュー「Multibox Menu」

 
codropsに公開されているグリッドを利用した心地よいアニメーションで展開するフルスクリーンメニュー「Multibox Menu」のアイデアを忘備録もかねて紹介します。 情報を整理・分類し効果的に誘導できるフルスクリーンメニューは情報量が多いサイトなど効果的に活用できそうです。

Multibox Menu

レスポンシブ対応もしており、ページをすっきり見せたい場合など参考になるアイデアです。以上、グリッドをうまく活用したフルスクリーンメニュー「Multibox Menu」を紹介でした。


  • CSSでクールなグリッチエフェクトを実装できる「CSS Glitch Effect」
  • ギザギザボーダーを作れるジェネレーター「CSS Jagged Border Generator」
  • カエルのゲームでFlexboxを学べるサイト「Flexbox Froggy」
  • コピペするだけで使えるCSSボタンジェネレーターまとめ
  • ブロックのアニメーションエフェクトが美しい「Block Reveal Effects」
RELATED POSTS
  • 【jQuery】ジオメトリックを実装できる「particleground.js」
  • 波の動きの背景を作成することができる「Wavie.js」
  • 【jQuery】画像をハーフトーンに変換するプラグイン「Breathing Halftone」
  • アイコンフォント「FontAwesome」の使い方
  • 【jQuery】レスポンシブ対応のスライダー「Glide.js」
  • リアルな水滴を表現できる「Rain & Water Effect Experiments」
POPULAR POSTS
  • 【無料】漢字が使える日本語フリーフォント59選
  • 似たフォントを探したい!フォントを調べる時に役に立つツール・サイト10選
  • 無料で使えるおしゃれな英語の筆記体フリーフォント20選
  • 無料で使える日本語・英語のかわいいフリーフォント20選
  • CSSグラデーションの作成に役立つジェネレーター・Webサービスまとめ
RECENT POSTS
  • Neumorphismを簡単に作れるジェネレーター「Neumorphism.io」
  • マルチカラーグラデーションのコードをコピーできる「gradienta」
  • SNSで使用する画像・動画サイズのテンプレート集「SocialSizes」
  • やわらかいタッチのイラストをダウンロードできる「Open Doodles」
  • 簡単にホバーエフェクトを実装できるCSSライブラリ「Izmir Hover Effects」