如何将div放在特定位置的较大可滚动div中

时间:2013-04-17 21:39:42

标签: javascript jquery html

我有一个高度= 10 *屏幕高度的div。

我想为它添加另一个较小的div,其中height = screen height

假设我可以在更大的div上添加10个这样的小div,我想在更大的div上的特定位置添加这个div。说从4 * screenheight像素开始。我如何使用jQuery做到这一点?

2 个答案:

答案 0 :(得分:1)

据推测,您已经存储了屏幕高度,并且两个div在正确的高度创建,所以:

$(inner_div).css('position', 'relative').css('top', 4*screen_height);

如果你的css已经在你的风格中,你可能不需要position:relative

答案 1 :(得分:0)

在这里看看你如何能够访问和操纵身体的高度以及之后的大div;

JSfiddle

<强> HTML

<div id="biggy">
    <div class="smally">Smally :)</div>
    <div class="smally">Smally 2, don't forget me :D</div>
</div>

<强> CSS

html, body {
    height: 100%;
    padding: 0px;
    margin: 0px;
}

#biggy {
    width: 200px;
    background-color: orange;
    position: relative;
}

.smally {
    width: 100%;
    background-color: blue;
    color: white;
    text-align: center;
    position: absolute;
}

<强>的JavaScript

$(document).ready(function() {
    var bh = $('body').height();
    var smally_offset = (bh / 10);

    // Set biggy to be the body's height
    $('#biggy').css('height', bh);

    // Make all smallies 10% of the set height
    $('.smally').css('height', smally_offset);

    // Handle the different smallies :)
    $('.smally:nth-child(1)').css('top', smally_offset * 0);
    $('.smally:nth-child(2)').css('top', smally_offset * 1);
});