3

「ホバー」トリガーで bs-dropdown を使用すると、ユーザーがメニュー項目をクリックできるほど長くメニューが表示されたままになりません。

http://plnkr.co/edit/Fi39BdCOqHXnPAgITD01?p=preview

遅延を使用すると、予期しない方法で動作します。

http://plnkr.co/edit/Y2Q63DDJEyP9CTPMUfYD?p=preview

理想的には、マウスがメニュー上にある限りドロップダウンは表示されたままになり、マウスがメニューから離れると消えます。

4

3 に答える 3

2

この問題の進行状況を追跡するには、この問題を参照してください。

bs-dropdown とトリガー ホバー #638

于 2014-11-10T08:47:47.943 に答える
1

これは、実際のドロップダウンにフォーカスするためにボタンの外にカーソルを合わせると、疑似イベントがトリガーされるhoverためです。代わりに、コンテナ自体mouseleaveを提供してみることができます。button例

<button type="button" 
        class="btn btn-lg btn-primary myButton" 
        bs-dropdown="dropdown" 
        data-container=".myButton">Hover to toggle dropdown</button>

ここで、同じボタンに指定したクラスを追加data-containerしました。myButton

プランク

非表示に遅延を使用しても効果はありません。アニメーションがキューに入れられると、指定された遅延の後に非表示が最終的に発生するためです。ドロップダウン オプションを選択します。ただし、回避策として、これに対する修正が提供されるまで、コンテナーを使用することができます。

于 2014-01-22T20:58:18.473 に答える
0

ブートストラップされたナビゲーション バーにドロップダウンを実装しようとしています。Blade1336 の応答でリンクされた github の問題を読んだ後、追加しましdata-container="self"た。これにより、ドロップダウン項目をクリックするのに十分な長さでドロップダウンが表示されました。残念ながら、それを追加した後、メニューのドロップダウン項目はクリックできなくなりました。data-container="self"また、わずかに不安定な UI エクスペリエンスが発生しました。私のコードは次のようになりました：

<li data-match-route="/config*">  
   <a bs-dropdown="configDropdown" data-trigger="hover" data-container="self">Config</a>
</li>

タグを切り替えて、タグに bs-dropdown を配置することになりました<li>。これにより、目的の機能が得られました（リンクは再びクリック可能になりました）。私のコードは次のようになります。

<li data-match-route="/config*" bs-dropdown="configDropdown" data-trigger="hover" data-container="self">
   <a>Config</a>
</li>

※<a>タグはスタイリングの為につけました

于 2015-06-25T20:53:09.460 に答える