Snow Monkey Mega Menu が開くタイミングを少しだけ遅らせてほしい

0
いいねをした人: 居ません
6件の投稿を表示中 - 1 - 6件目 (全6件中)
  • 投稿者
    投稿
  • #112343
    GONSY
    参加者
    692

    いつもお世話になっております。
    「Snow Monkey Mega Menu」についての要望です。

    こちらのサイトでSnow Monkey Mega Menu(メガメニュー4)を「商品一覧」に使用しています。
    たとえば、グローバルナビゲーションの「ホーム」から横にマウスをスライドさせて「店舗案内」を選択しようとした際、「商品一覧」の上を通りますが、「商品一覧」のメガメニューがチラっと一瞬だけ開きます。

    できれば、マウス通過による反応を回避して、確実に「商品一覧」にマウスを当てた場合だけメガメニューを開くようにしたいです。
    200ms程度で良いと思いますが、遅延して反応するのがベターかと考えています。
    この手のUIは考え方もさまざまあり、意図的に今の表示になっているかと思いますが、ご検討いただけると嬉しいです。

    0
    いいねをした人: 居ません
    #112402
    キタジマ タカシ
    参加者
    1736

    あーなるほどです。メガメニューに限らず普通のメニューももしかしたらそうしたほうが良いかもですね。ちょっと実際に遅延させてみて操作感を確かめてみたいと思います!

    0
    いいねをした人: 居ません
    #112924
    キタジマ タカシ
    参加者
    1736

    JavaScript で開くタイミングを調整しようと思っていたのですが、CSS でやったほうがユーザー側でもタイミング調整しやすいかも?と思ってちょっとやってみています。

    .p-global-nav .c-navbar__submenu[aria-hidden="false"] {
      transition-delay: 1s;
    }
    
    @media (hover: hover) and (pointer: fine) {
      .p-global-nav .c-navbar__item[aria-haspopup=true]:active:before,
      .p-global-nav .c-navbar__item[aria-haspopup=true]:focus:before,
      .p-global-nav .c-navbar__item[aria-haspopup=true]:hover:before {
        transition-delay: 1s;
      }
    }

    セレクタはちょっと調整が必要かもですが、こんな感じはどうでしょうか?

    2
    いいねをした人:
    #112933
    GONSY
    参加者
    692

    @キタジマ さん

    WordPress 6.1 のリリース間近のタイミングで対応していただきありがとうございます。
    CSSでもいけるんですねー。調整しやすいという点で、CSSのほうがメリットがあると思います。
    該当のサイトに反映して良い感じにできました!
    トピックをCLOSEします!

    0
    いいねをした人: 居ません
    #112937
    キタジマ タカシ
    参加者
    1736

    確認ありがとうございます! 一応まだセレクタをどうするかや CSS 変数を使うかなど考え中ですが、6.1 対応版の Snow Monkey v18.0.0 にこの CSS とほぼ同等なものを取り込もうと考えています。

    1
    いいねをした人:
    #113070
    キタジマ タカシ
    参加者
    1736

    Snow Monkey Blocks v18.0.0 で、下記の CSS で調整できるようにしました!

    .p-global-nav {
      --global-nav-submenu-open-delay: 1s;
    }
    1
    いいねをした人:
6件の投稿を表示中 - 1 - 6件目 (全6件中)
  • トピック「Snow Monkey Mega Menu が開くタイミングを少しだけ遅らせてほしい」には新しい返信をつけることはできません。

ドキュメント

Snow Monkey の設定方法やマニュアルを掲載しています。

ドキュメント

フォーラム

Snow Monkey の使い方やカスタマイズについてのご質問・ご要望等はサポートフォーラムで行っています。サポートフォーラムは誰でも閲覧できますが、書き込みできるのは Snow Monkey 購入者のみとなります。

サポートフォーラム

よくあるご質問

Snow Monkey のサービスについて不明な点がある場合は、まずはよくあるご質問をご確認ください。

よくあるご質問

お問い合わせ

よくあるご質問を見ても解決しなかった場合、試用版の申請については問い合わせフォームからお願いいたします。

お問い合わせ