ハンバーガーメニュー アニメーション ( VelocityJS )

[ ID : 277 ]
ブロンズ
ハンバーガーメニュー アニメーション ( VelocityJS )

概要

【jQuery】VelocityJSを利用したアニメーションでハンバーガーメニューを作成する方法を紹介。

用途

  • ハンバーガーメニューをクリックするとクロス(×)のアイコンへアニメーションで変形。
  • オーバーレイを設置して、メニューの外側をクリック(タップ)でもメニューを閉じる。
  • アニメーションの処理にはVelocityJS(v1.5.2)を使用。

検証ブラウザ

  • Google Chrome(最新)
  • Safari(最新)
  • Firefox(最新)
  • Microsoft Edge(最新)
  • IE11

その他

  • jQuery v3.6.0使用。

実装方法

このコンテンツの続きを閲覧するにはログインが必要です。 新規会員登録

この記事をシェアする

全ての記事を見る

KONOCODEのメリット 無料会員登録