エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
localStorageで保存可能の、シンプルなテーマ切り替え
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
localStorageで保存可能の、シンプルなテーマ切り替え
Result ダークモードにも使えるテーマスイッチです。サンプルは簡単なものですがスタイルはCSSで制御し... Result ダークモードにも使えるテーマスイッチです。サンプルは簡単なものですがスタイルはCSSで制御しているので応用は効くと思います。 JavaScriptは切り替えとlocalStorageへの保存に利用されています。 javascript//デフォルト設定 const pressedButtonSelector = '[data-theme][aria-pressed="true"]'; const defaultTheme = 'green'; //buttonにセットしたカスタムデータ属性に準じてテーマ切り替え const applyTheme = (theme) => { const target = document.querySelector(`[data-theme="${theme}"]`); document.documentElement.setAttribute