私のhrefがフラッシュを含む他のレイヤーよりも優先されるようにするにはどうすればいいですか？

Question

私は自分のサイトのメディアギャラリーを作りました。メディアギャラリーには、YouTubeやVimeoなどのサイトのメディアアイテムが含まれています。

私が使用しているシステムでは、リンク先のメディアアイテムに対してthumnailは生成されません。だから私がやったことは、メディアギャラリーにメディアの小さな「ビュー」を表示することだけです。つまり、グループ化されたリストエリアに埋め込み動画の小さなバージョンを表示しているだけです。これにより、メディアアイテムのサムネイルビューが効果的に表示されます。

私は、埋め込まれたビデオを望むところでラッピングしています。私のサイトのメディアアイテムの「ビュー」ページにリンクされます。 YouTubeの埋め込みビデオをラップすると、そのリンクは訪問者を自分のメディアアイテムページに連れて行きます。しかし、私がVimeoのビデオをラップするとそのリンクは無視され、クリックするとVimdeoのビデオが実際に小さなthumnbailビューで再生を開始します。

Vimeoの埋め込み領域をクリックするのを抑制する方法はありますか？私のリンクをVimeoビデオの上に置くCSSがありますか？

大変ありがとうございます。

Answer 1

このようなものを試してみてください。ビデオをカバーするために必要なz-indexの働きは、スパンがビデオをラップする必要はありません。スパンにいくつかの高さと幅の条件を入れる必要があるかもしれません。

<div class="vid_container"> 
<a href="#"> 
<span></span> 
< your video tag > 
</a> 
</div> 

.vid_container a{position:relative;} 
.vid_container a span{display:block; position:absolute;top:0;left:0;z-index:200;} 
.vid_container a videotag {display:block; position:absolute;top:0;left:0;z-index:1;} 

Answer 2

ウェブレイアウトでの "3d"ポジショニングは...複雑で、言い表せません。誰もが知っている部分は、Z-インデックススタイルです。しかし、多くの人々が気づいていないのは、DOMツリーの同じ深さにある場合、2つの要素のZ-インデックスの差が出てくるだけです。そうでない場合は、ツリーの上位にある（つまり、BODYの直下に最も近い）ものは、Z-インデックスにかかわらず、常に「最上位」になります。

したがって理論的には、AタグをDOMの上位に配置すると、そのタグは動画よりも優先されます。 IEではそうではないかもしれません。 IEでは、特定の要素（私はSELECTがこれをしていることを知っていますが、ビデオもおそらくそうです）は常に「上」に表示されます。これの一般的な回避策は、コンテンツの背景として、これらの要素の1つ（通常はIFRAME）を使用することです。あるいは、この種のことを処理するライブラリ（jQuery用のbgiframeプラグインなど）があります。

"onclick"イベントハンドラをA（またはビデオそのもの）に接続し、そのハンドラで "e.stopPropagation（）"を試してみてください。クリックが「バブルアップ」しないようにします。 "e.preventDefault（）"を使ってムービーのデフォルトアクションが開始されないようにすることもできますが、ムービーでそれを行う必要があります（またはAで行う場合は、ハンドラを作成する必要があります"window.location = link"を実行します。これは、Aのデフォルト動作、つまりリンクへの移動を妨げるためです。

希望のアイデアの1つがあなたに役立ちます。