2

HTML5 ドキュメントに video 要素があります。ビデオ要素を部分的に覆うために動的にスライドするコントロール パネル div があります。

これは Firefox と IE9 で正常に動作します。ただし、Google Chrome では、Video 要素の上にあるリンクのどの部分もクリックできません。リンクの上にマウスを置いてもポインタは変化せず、リンクをクリックしても何も起こりません。

コントロールを表示しないように Video 要素を設定すると、問題は修正されます。しかし奇妙なことに、コントロールを有効にして Video 要素を開始し、次に Controls 属性を動的に削除すると、リンクをクリックできなくなります。jQuery と通常の JavaScript の両方を使用してみました。

現時点では、コントロールを表示する必要がないので、私のページは問題ありません。しかし、私は問題をよりよく理解したいと思っています (さらに、他の誰かが同じ問題を抱えている場合、この投稿が役立つかもしれません)。IE9 や FF と比較して、Chrome がビデオ要素を処理する方法に違いはありますか?

4

1 に答える 1

1

コード内の重複する要素の両方に追加z-indexしましたが、問題なく機能します。たとえば、最初の CSS は次のようdivに変更されます。

div.first {
  left: 0;
  top: 0;
  z-index: 255;
}

そして、最初videoに次のように変更されます。

<video controls style="z-index:0">

div要素の上に浮かんでいる部分を含めて、最初の 内のリンクをクリックできますvideo。

于 2012-11-06T13:00:08.560 に答える