10

クリック以外のすべてのマウスイベントを無効にしたいのですが、これがあります:

.info {
    -webkit-transform: rotate3d(1, 0, 0, 90deg);
    transform: rotate3d(1, 0, 0, 90deg);
    width: 100%;
    height: 100%;
    padding: 20px;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 4px;
    pointer-events: none;
    background-color: rgba(26, 188, 156, 0.9);
}

しかし、ポインターイベント: なし。すべてのイベントを無効にします。

4

2 に答える 2

7

pointer-events 属性には、次の 3 つのプロパティしかありません。

  • なし、
  • 自動、
  • 継承する

だから付けると

    pointer-events: none;

要素に対しては、すべてのイベントが無効になります。

    pointer-events: auto;

ただし、すべてのデフォルト機能を復元し、要素の親に pointer-events: none がある場合に適しています。

(いくつかの JavaScript 操作を除いて) 役立つと思われる回避策は、オブジェクトを親コンテナーにラップして追加することです。

    pointer-events: none;

その親コン​​テナに移動し、次を使用します。

    pointer-events: auto;

.info で、コンテナの子要素に .info を追加します。

探しているものを正確に達成することはできませんが、そのクリックのみの錯覚を再現します.

于 2015-06-24T20:50:13.270 に答える
2

1 つのアプローチは、最初に任意の 1 つの要素のすべてのインスタンスを次のように作成することです。

 pointer-event:none

たとえば、ここではすべてのimgタグをpointer-event:nonecss ファイルのように作成しています。

img{
        pointer-event:none
     }

次に、クリック可能な要素(たとえばimg)を別のタグ(など)内div, spanに囲む必要があります

例えば:

<div class="enclosing-img-class" click="sampleEvent()">
  <img src="sample.png" alt="No Image available">
</div>
于 2017-08-28T09:15:11.820 に答える