透明なdivをクリックしてjQueryのホバーをクリックします。

Question

私はドラッグ可能なyoutubeビデオの上に横たわる透明なdivを持っています。 youtubeビデオはドラッグ可能ですが、ビデオを一時停止/再生することはできません。これに対する私の解決策は、ボタンのサイズ（ビデオの一番下）であるdivを使用することです。ユーザーがその上を移動すると、オブジェクトはもはやドラッグできなくなります。カーソルが離れると、オブジェクトは再びドラッグ可能になります。大部分のビデオをクリックしてドラッグすることができます。私はクリックがビデオに通過できるようにするようCSS pointer-events: none;を使用

：

は、ここで問題がinlies。しかし、pointer-events:none;の場合、jQueryはmouseenterを認識せず、マウスが残っていると仮定し、ドラッグ可能なオブジェクト（今すぐ）をクリックさせません。

mousemovementがその領域に移動しているかどうかを確認するためにいくつかのハックを行うことはできますが、面倒で一般的に、マウスを移動するたびに呼び出される関数を持つことは非常に非効率です。ウェブサイト私はむしろこのようにアプローチしたくないでしょう。

アイデア？

編集： アイデア？ コードは不要です。

Answer 1

これは、ドラッグ機構に対してどれだけの制御があるかによって異なります。あなたが書いたように聞こえます。もしそうなら、あなたはそれを逆向きにやっています。ドラッグ可能な領域をブロックするのではなく、ドラッグ可能な領域を有効にする必要があります。別の方法をとると、「ドラッグハンドル」として機能するようにドラッグ可能な領域にdivを配置する必要があります。

他に何ができるのかわかりません。イベントハンドラは、周囲のDOMまたはdocument.body自体に配置することもできますが、ドラッグ領域と非ドラッグ領域の間の判断には役立ちません。

私のソリューションがうまくいかない場合は、マウスのx/yの位置を確認する必要があります。はい、手間がかかり、やや高価ですが、Flashなどの制御権がない外部の外部コードを操作するときに、時々このようなことをする必要があります。

Answer 2

YouTubeビデオをオーバーレイするdivを作成するだけでは、ボタンをまったくカバーできないのはなぜですか？そのようにすると、マウスがメインの「ドラッグ」divからボタンに移動すると、ドラッグが停止してクリックがYouTube要素自体に表示されます。

Answer 3

私は、透明なdivですべてをカバーし、ボタンの細かい操作を行う代わりに、透明なdivのmousedown/move/upハンドラを使ってビデオのドラッグを処理する方が簡単だと思います。組み込みdivを変更する必要がある場合は、維持する方がずっと簡単です。

IIRC Internet Explorerが完全に透過的なdiv（！）のイベントを無視するように注意してください。