0

http://offbeatdestination.comのメニュー バーの上部に木製のディスプレイ ボードを配置しようとしています。次のコードを使用して、これを正常に実行しました。

<div style="position:relative;min-width:960px">
    <img src="http://i43.tinypic.com/16nkvl.png" style="position: absolute;left:145;top:140" />
</div>

上記のコードで直面している問題は、ページに画像を表示するためにモーダルを使用している (たとえば、http://offbeatdestination.com/infinity-resort/ ) ことですが、モーダル ウィンドウが表示部分のはるか下に表示されています。画面を下にスクロールする必要があり、ユーザーフレンドリーではありません。

上記のコードを削除すると、すべて問題ありません。ポップアップ画面に影響を与えずに画像を配置するにはどうすればよいですか?

4

2 に答える 2

0

おそらく2つのことが間違っています。あなたが使用している Javascript は、位置を間違って計算しています。これを修正する非常に簡単な方法は、CSS シートに追い越しスタイルを追加することです。画像の高さが異なるため、最高ではないかもしれませんが、うまくいくかもしれません。

#colorbox{
top: 50% !important; /*50% from the top and using !important overtakes any inline styles*/
margin-top: -196px; /*Negative margin of the half the height of the largest image in the slideshow.*/
position: fixed; /*fix the position in the browser*/
}

何かあれば、実際に Javascript を修正して、レイアウトや「本文」の高さではなく、ブラウザ ウィンドウ サイズの高さを確認する必要があります。

于 2013-10-02T20:55:11.157 に答える