2

現在、作業中の画像スライダーを微調整しようとしています。私がやろうとしているのは、ユーザーがブラウザのサイズを変更したときに、スライダがブラウザの左側に接する位置を同じに保つことです。以下の例を確認してください

            +------------------------+
            |          body          |
+--------------------------------------------------+
|           |                                      |
|           |<- Keep this aligned at the same      |
|           |    position on browser resize?       |
|           |                                      |
|           |                                      |
|           |                                      |
+--------------------------------------------------+
            |                        |
            +------------------------+


HTML:
<div id="scrollerWrapper">
    <div id="imageScroller">
        <img class="i" href="..." />
        <img class="i" href="..." />
        <img class="i" href="..." />
        <img class="i" href="..." />
    </div>
</div>

    browserHeight = parseInt($(window).height(), 10);

    galleryMargin = browserHeight * 0.025;
    imageHeight = browserHeight - 80 - (galleryMargin * 2);
    if (imageHeight < 250) {
        imageHeight = 250;
    }
    $(".i").css("height", imageHeight + "px");
4

1 に答える 1

0

多分あなたはあなたの質問でもっと詳しく知ることができます.あなたが説明したことから私が理解したことはこのように見えます.JavaScriptはまだ必要ありません

フィドルはここにありますhttp://jsfiddle.net/caramba/LzwUP/

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
* { padding:0px; margin:0px; }
</style>
</head>
<body>
    <div style="position:absolute;width:100%;height:400px;background-color:orange;">
        <div style="position:relative;left:0px;top:100px;width:500px;height:200px;background-color:navy;"></div>
    </div>
</body>
</html>
于 2013-02-26T21:03:26.413 に答える