どうも。最近、朝晩が気温が下がり涼しくなって秋の訪れを感じています。
さて、DigiPressテーマ「MAGJAM」では、デフォルトで画面スクロール時にグローバルナビゲーションを透明になり上部に固定して追従される仕様になっています。
記事を読んでいる中、グローバルメニューが追従してくるれるので便利ですが反面、記事の上部へマウスカーソルを移動させているときに、このグローバルメニューの自動追従で誤って別の箇所をクリックしてしまうこともあります。
そこで今回は、「グローバルメニューが自動追従をしない方法」を紹介します。
やり方は、とても簡単で「オリジナルスタイルシート設定」にCSSを記述するだけです。
MAGJAMのデフォルト
デフォルト状態では、上記のように画面をスクロールするとグローバルナビゲーションが透明になり上部に固定されたまま追従します。
オリジナルスタイルシート設定にCSSを記述後
オリジナルスタイルシートにCSSを記述して定義すると上記のように、グローバルメニューが固定されなくなり、自動追従しなくなります。
コード
1 2 3 |
#global_menu { position:relative!important; } |
上記CSSコードを記述するだけで、自動追従しないよう設定できます。
設定方法
DigiPress⇢「ビジュアル設定」⇢「オリジナルスタイルシート設定」内のオリジナルスタイルシートにCSSを記述して最後に「設定保存」しましょう。
あとは画面をスクロールして試してみましょう。グローバルメニューが追従しないようになったと思います。
グローバルメニューを透明化せずくっきり表示する方法
この他にも、以前の記事で紹介した、「グローバルメニューを透明化せずにくっきり表示するやり方」もあります。
MAGJAMでスクロールした時にグローバルナビゲーションを透明にならないようにする方法
さいごに
グローバルメニューを自動追従(デフォルト)に戻したい場合は、オリジナルスタイルシートに記述したCSSを消去すれば元の状態に戻すことができます。
上記のやり方を覚えれば、「グローバルメニュー追従(デフォルト)」、「グローバルメニュー追従しない」、「グローバルメニューをくっきり表示」とカスタマイズできます。
いずれもCSSを記述するだけなので簡単ですね。
好みに合わせて設定してみると良いでしょう。
それではまた〜