[CSS/JS] 様々なエフェクトのスライドメニューのサンプル

記事内にプロモーションを含む場合があります。

SidebarTransitions

ボタンを押してサイドメニューを表示させるサンプルスクリプト。
メニューがスライドする、メイン画面がスライドする、ドアのようにスライドするなど様々なアニメーションエフェクトが用意されています。

PCからスマートフォンまで、画面サイズにより可変するレスポンシブレイアウトでは、このようなサイドメニューが有効なようで多く見られますね。(PCではメニューを表示して、スマートフォンでは隠してボタンをタップするとメニュー表示するなど) 

[ Transitions for Off-Canvas Navigations ]