WordPressドロップダウンメニューにスクロール機能を追加

今日、あるクライアントの外国貿易向け独立サイトのメニューにスクロール機能を設定したので、記録しておきます。WordPressでECサイトを構築する外国貿易向け独立サイトでは、多くのThemeがスーパーメニューをサポートしていますが、それにより特定のサブメニューの内容が非常に長くなり、表示に不便な場合があります。そのため、一定のピクセル数を超えたらスクロールバーを表示する機能を設定する必要があります。方法は簡単で、overflow-yパラメータを追加するだけです。

ul ul{
    max-height:500px;
    overflow-y:scroll;
}

例えば上記の例では、最大高さを500pxに設定し、overflow-yをスクロールに変更しています。overflow-yプロパティは、要素のコンテンツ領域からはみ出した場合に、上下の端のコンテンツをクリップするかどうかを指定します。以下の値がサポートされています：

值	説明
visible	コンテンツをクリップせず、コンテンツボックスの外に表示される可能性があります。
hidden	コンテンツをクリップします - スクロールメカニズムは提供されません。
scroll	コンテンツをクリップします - スクロールメカニズムを提供します。
auto	ボックスからオーバーフローした場合、スクロールメカニズムを提供する必要があります。
no-display	コンテンツがコンテンツボックスに適合しない場合、ボックス全体を削除します。
no-content	コンテンツがコンテンツボックスに適合しない場合、コンテンツ全体を非表示にします。