いくつかの遷移要素を含むアプリケーションがあります。これらの同じ要素は、mouseenter および mouseleave イベントに反応します。これらのイベントは、ユーザーが移動中の要素と対話するのを避けるために、移動中に非アクティブ化されます。
これらの要素の 1 つが再びアクティブになったときにマウスの下にあると、問題が発生します。移動要素が移動しなくなったら、マウスがそれらの上に置かれていることを再び登録する必要があります。ただし、要素が非アクティブ化されている間に mouseenter が発生したため、要素が再度アクティブ化されると、イベントは発生しません。
次に、マウスを要素から離してから再度上に移動すると、正常に機能します。これは明らかにユーザーフレンドリーではありません。
マウスを動かさずにマウスが要素の上に乗っていることを登録する方法はありますか?
上記の要素の詳細: 問題の要素は、多くのコンテンツを含む大きな div です。実際には、動的に追加および削除するアプリケーション内のページです。領域にフォーカスがあるかどうかを示し、フォーカスがない場合は非表示にするカスタム スクロール バーがあります。
マウスがページ コンテンツ領域に移動すると、カスタム スクロール バーが表示されます。移動すると、スクロール バーは再び非表示になります。アニメーションの実行中は、すべてのイベントが非アクティブになります。
問題は、ページのアニメーション中にマウスがページ領域に移動すると、スクロールバーが表示されない (表示されるべきではない) ことです。ただし、アニメーションが完了すると、アプリケーションは、ユーザーがページ領域内でホバリングしていることを登録する必要があります。ユーザーはマウスをこの領域の外に出してから戻す必要はありません。