0

わかりましたので、ボディの幅や高さを変更せずに、特定の数の div をボディに追加しようとしています。つまり、新しい div はビューポート内にとどまる必要があります。ここに私のコードを示します。

divAmount = 6;
$(document).ready(function(){
windowWidth = $(window).width();
windowHeight = $(window).height();


game();


$('body').css({
    "max-width" : windowWidth,
    "max-height" : windowHeight 
    });

});

function game(){ 


for (var i = 0; i < divAmount; i++) {
        $("<div class='box' />").appendTo("body").css({
            "margin-left" : Math.floor(Math.random() * windowWidth - 100) + 1,
            "margin-top" : Math.floor(Math.random() * windowHeight - 100) + 1
        });
}

$('.box').click(function(){
    $(this).removeClass('box').addClass("exploding");
}); 




};

これにより、div が正しく追加されます。ただし、それらはビューポート内にとどまりません

4

2 に答える 2

0

ここに私が作った実用的なフィドルがあります - http://jsfiddle.net/Kn3V3/

.box div に絶対配置を指定すると、スペースを取りません。

.box {
    background: red;
    height: 10px;
    width: 10px;
    position: absolute;
}

ただし、誰かが上で言ったように、コンテナー div を本体ではなくウィンドウの高さと幅にしてから、本体を 100% h/w にする必要があります。（それは私がフィドルでやったことです）

于 2013-10-07T16:21:42.410 に答える