ダッシュボードにframer-motionライブラリを使った設定メニューコンポーネントを作ってみよう
こんにちわ。nap5です。
ダッシュボードにframer-motionライブラリを使った設定メニューコンポーネントを作ってみたので、紹介したいと思います。
framer-motionライブラリはこちらになります。
以前の記事と関連です。
今回はメニューコンポーネントをレスポンシブ対応しています。表示幅が狭いモバイルの方ではサイドバーをフレックスで可変にしてスタートしていたことから、ハンドリングは無理せずにそのままにしています。モバイルで見るときはオーバーレイがかかったサイドバーにしていくのがいいと思います。
デモサイトです。settingsページに実装してみました。
デモコードです。
最近では、MENTAをはじめてみました。MENTAを使って提供していることを紹介している記事は以下になります。
また、Twitterでモックアップ動画を公開しているので、こちらもよかったら、覗いてみてください。
最後に、Udemyでコースを公開しました。
良かったら覗いてみてください。
https://www.udemy.com/course/count-down-up-using-javascript-animation-api/
また、コースの内容紹介記事は以下になります。
簡単ですが、以上です。
この記事が気に入ったらサポートをしてみませんか？