jQuery-UI ダイアログと同じ方法で要素を配置しようとしています。
ダイアログを開くと、(ビューポートに対して) 指定した位置に適切に配置されます。ただし、ページをスクロールすると、ダイアログはページ コンテンツの残りの部分と一緒に移動します。
これはCSSでどのように行われますか?
明確にするために-配置したい要素は非表示になっており、 $("#element").show(); を使用して表示します。
ビューポートに関連して表示し、ダイアログと同じように動作させたいです（ページをスクロールすると移動します）。
position:fixed;ダイアログ ボックスで を使用しtopてから、 と を使用しleftて、必要な場所に配置します。このように、ページとともにスクロールします。
位置が固定されていると、スクロールしてもダイアログはブラウザーの画面上の同じ場所に留まります。CSS:
position: fixed;
絶対位置では、ダイアログはコンテンツに対して同じ場所にとどまるため、上にスクロールするとコンテンツとともに上に移動します。CSS:
position: absolute;
両方の例を次に示します: http://jsfiddle.net/sRkbf/
UI ダイアログを読むと、UI position() プラグインが使用されます。モーダルの場合、ページとともにスクロールすると思います。
私は同じものを使用することで、私が望むものに十分近づいています。ダイアログとページ自体の両方に「アラート」があります。ダイアログ アラートについては、position() を使用してアラートをダイアログの中央に配置し、ページ アラートのビューポートの中央に配置しました。位置は固定ですが、正確に配置されているので問題ありません。
ビューポートに関連して要素を表示し、絶対と固定の組み合わせのように、ページとともにスクロールできるといいのですが、それを実行した人を見つけることができませんでした.