問題タブ [pointer-events]

アプリの左上隅にあるメニューボタンをイオンローディングショーのときにクリックできるようにしたいのですが、メニューボタンがイオンローディング背景と重ならないようにバックドロップマージンを移動しました。ここに私のコードがあります:

app.js でイオン読み込みを呼び出すコードの 1 つを次に示します。

ポインターイベントも自動に設定しましたが、ボタンメニューをクリックできません。誰か助けてください。

HammerJS の内部イベント ループにスタックしたイベントが残り、その後の検出が台無しになると思われる奇妙な問題に直面しています。

これは、PointerEvents を使用するタッチ デバイス上の Internet Explorer Edge でのみ発生します。

PAN基本的に、イベント ( panstart-> panmove-> panend) にHammerJS を使用し、現在のフレーム境界を越えて(たとえば、IFRAME に入る、またはブラウザー ウィンドウのすぐ外側に) 、そこで指を離すと、HammerJS は CANCEL を受け取りません。イベントとセッションの種類はスタックしたままです。

それ以降、使用しているよりも 1 本多い指 (「ポインター」) で、すべてのジェスチャーが正しく報告されません。

このゴースト状態になった後に Hammer Manager をリセットする方法が見つかりませんでした。これは私のアプリを壊します。

完全に機能する例を含む Fiddle を用意しました。Windows/Touch デバイスで実行してください。

https://jsfiddle.net/28cxrupv/5/

範囲外のイベントを検出する方法、またはスタックしたイベントがあることを他の方法で検出できる場合、Hammer Manager インスタンスを手動でリセットする方法を知りたいです。

アップデート

調査の結果、問題は HammerJS の最も低いレベルにあることがわかりました。PointerEvents ハンドラーには、検出されたポインターの配列がthis.storeあり、古いタイムスタンプを持つスタック イベントがあります。

SharePoint 2013 リスト編集ページでハイパーリンクを無効にしようとしています。コンテンツ エディターの Web パーツを使用して、pointer-events : none. Google Chrome では正常に動作しますが、IE では動作しません。これに代わるものはありますか？CSSの代替が欲しいだけです。私のIEはバージョン10です。

私のシナリオは、div で「クリック」および「マウスアウト」イベントをリッスンすることです。クリック イベントが発生すると、ポインター イベントを無効にするクラスが div に追加されます。これは、ポインター イベントが無効になった後に 1 つの最後の 'mouseout' イベントが発生することを除いて機能します。理由/修正方法はありますか？

http://codepen.io/BradLee/pen/grzrOz

スクロール可能な領域でドラッグ可能な div の場合を考えてみましょう。div の内側をタッチすると、さらに指を動かすと、div が領域内でドラッグされます。div の外側に触れると、さらに指を動かすと、スクロール可能な領域がパンされます。

これを示す JSFiddle があります。マウスを使用すると、div を簡単にドラッグできますが、タッチ イベントも同様に機能しないようです。

注: 私はフィドルでポインター イベントを使用しているため、それらをサポートしていないブラウザーを使用している場合、フィドルが壊れているように見えるかもしれません。

この相互作用を適切に実装する方法を知っている人はいますか?

http://jsfiddle.net/mrmills/13t34jsv/

HTML:

CSS:

JS:

クリックするとポップアップが表示されるリンクがあります。

リンクをクリックすると、ポップアップとともにオーバーレイが表示されます。

DIV

CSS

私の問題は、ポップアップが表示されているときでも、オーバーレイをクリックして、div コンテナー内の他のリンクにアクセスできることです。「pointer-events: none;」を設定する方法はありますか? ポップアップが表示されている限り、div id="container" に適用されますか?

Windows 7 の ie11 にのみ適用される非常に奇妙なバグに遭遇しました。

pointer-events: none親要素に適用する場合pointer-events:auto、それを持つ要素では機能しませんdisplay:inline-block

Windows 8でも発生する可能性がありますが、Windows 10では修正されたようです。

以下は、私が言いたいことのスニペットの例です。ホバーすると、画面が水色に変わることがわかります。すべてのポインター イベントを削除してから、緑色のボックスと不透明な白いパンくずリストのポインター イベントをオンに戻しました。

緑色のボックスが独自のポインター イベント (背景を濃い青色に戻す) を持っていることがわかります。パンくずリストは完全に無視されます。

これinline-blockをWindows 7（およびおそらくWindows 8）でie11で動作させる方法はありますか？

psブラウザスタックを使用してこれをテストしましたが、説明したセットアップで適切に機能しました。テストするWindows 7マシンが他にないため、これが1つのラップトップにローカライズされているだけかどうかはわかりません

これが私がいじったフィドルです

上記のフィドルを使用してインラインブロック要素をブロック要素にすると、ポインターイベントが再び機能することがわかります