0

私は Web サイトを構築しています。ユーザーがフォームに入力するときに背景を隠すために、暗い半透明の背景画像を追加したいと考えています。現在の実装が機能していないため、これをどのように行うのか疑問に思っています。

現在、実装しようとすると、半透明の背景がページの幅全体に水平方向に伸びず、ページの下部に不要な垂直方向のスペースを作成するようです。私の既存のソリューションには、div を作成し、position:relataive; top:-1100px; left:0px;この div を必要な場所に正確に配置するために使用することが含まれます。

ウェブサイトでは、この半透明の背景は「Find Us」という名前の 4 番目の最後のページにあります。「フィードバック」と表示されたタッセルをクリックすると、フォームが表示されます。現在、背景が混み合っているためフォームが読みにくいため、半透明の背景カバーを使用して、現在のページのフォーム以外のすべてを「ぼかし」たいと考えました。

半透明の背景を追加しようとする前のデモ: http://www.sfu.ca/~jca41/stuph/it/website01/template.html

半透明の背景を追加しようとした後のデモ: http://www.sfu.ca/~jca41/stuph/it/website02/template.html

4

2 に答える 2

1

タッセル div よりもカバー div の z-index が大きい。タッセル div の z-index を 120 に設定すると、すでに z-index 115 のカバーがあります。それが機能するかどうかを確認します。

于 2012-06-29T04:46:56.257 に答える
1

の CSS を変更し#coverます。

#cover {
  position:absolute;
  top:0px;
  left:0px;
}
于 2012-06-29T04:41:37.463 に答える