ポップアップビデオプレーヤーを作成しようとしています。fancyboxを使用しますが、非営利であり、私のユースケースは比較的単純です。基本的に、すべてのコンテンツを表示するのに十分な不透明度で、ページ全体を黒い背景でカバーするdivを作成しています。この「オーバーレイ」divの上に、ページ上のユーザーの現在の場所（高さ方向）にYouTubeビデオを（iframeハードリンク挿入を介して）配置したいと思います。基本的に、ユーザーがスクロールしなければならないページの高さの位置にこのビデオを配置したくありません。
ブラウザとサポートを含むjqueryライブラリを調べましたが、何も注目されませんでした。私が見逃している方法はありますか？ちなみに、これはJavascriptソリューションである可能性があります。たまたま、他のすべてにJQueryを非常にスタイリッシュに使用しています。
編集：
この新しいdiv（iframeコードを含む）をユーザーのブラウザービューポートが現在ある場所に配置しようとしていますが、ドキュメントの高さやブラウザーのビューポートの高さを決定していません。
$（window）を使用します。例えば：
console.log($(window).height());
console.log($(window).width());
ブラウザウィンドウのサイズを変更してみてください。変更が表示されます。
ウィンドウビューポートがスクロールされる位置を取得する場合は、$（window）.scrollTop（）および$（window）.scrollLeft（）を使用します。
特定の要素の位置を取得する場合は、$（ "＃myid"）。position（）（オフセットの親に対して）または$（ "＃myid"）offset（）（ドキュメントに対して）を使用します。
ドキュメントの高さを取得するには：
$（window）.height（）;
ドキュメントの幅を取得するには：
$（window）.width（）;
.height()または.outerHeight()両方が機能する必要があります：
$(window).height();
$(window).outerHeight();
$(window).width();
$(window).outerWidth();
PrettyPhotoを使用しています。大きすぎず、JavaScriptに慣れている場合は、不要なコードを削除してさらにコンパクトにすることができます。