0

私はこのモーダル画像ビューアに取り組んでいます。問題は、画像のコンテナとなる div を追加できないことです。この div が必要なのは、その中にナビゲーション ボタンを追加したいからです。ポイントは、ブラウザのサイズに応じて画像のサイズを変更できることです。最大高さ: 80%; 画像CSSに設定されています。 div を動的に画像のサイズと同じサイズにする必要があります。 やり方を教えてください。

ここにHtmlがあります

<div id="imagePlaceholderContainer">
    <img id="imagePlaceholder" src="images/full/Full28.jpg" />
</div>

そして、ここにCssがあります

#imagePlaceholder {
    margin: auto;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 999;
    max-height: 80%;
    border: 5px solid black;
}

ありがとう。

4

1 に答える 1

0

画像ではなくdivにスタイルを適用する必要があります

#imagePlaceholderContainer {
    margin: auto;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 999;
    max-height: 80%;
    border: 5px solid black;
}

#imagePlaceholder {
    height:100%;
    width:100%;
}

JSFiddle: http://jsfiddle.net/R49mW/

重複した質問から分岐したフィドル: http://jsfiddle.net/wwbd4/

于 2013-11-04T02:32:21.263 に答える