CSS div使用座標定位

我目前正在用javascript編寫一個簡單的遊戲。遊戲發生在div，名爲＃box。而敵人是div叫#enemy。CSS div使用座標定位

 <div id="box"> 
       <div id="prepend"> 
        <div id="hero"></div> 
       </div> 
       <div id="enemy"></div> 
     </div>

這裏面#box的#enemy將移動有關使用setInterval()函數產生隨機數（動畫到X，Y）。但是，當我這樣做時，不知何故座標開始的原點位於窗口的左上角，當它位於＃box的左上角時。這是我怎麼一直試圖產生隨機數保持#enemy的#box

var test = Math.floor(Math.random() * (1500 - $("#box").offset().left) + 0), 
    test2 = Math.floor(Math.random() * (750 - $("#box").offset().top) + 0);

但問題我明明已經內在於它保持#box之外動畫。

CSS：

#box{ 
    width:640px; 
    height:400px; 
    float: left; 
    background:url(../png/space.jpg); 
    margin: 0 0 0 100px; 
    } 
    #enemy { 
    width: 69px; 
    height: 50px; 
    position: absolute; 
    margin: 100px 0 0 100px; 
    background:url(../png/target2.png); 
    z-index:2; 
}

來源

2013-04-16 user1859736

容器div需要有position: relative。否則，將使用窗口的位置或具有relative位置的最接近的父元素來確定內部的div的位置。通過使父母具有相對位置，孩子div將自己定位相對到其父母，而不是相對於該窗口。

來源

2013-04-16 14:19:53

您需要：

position: relative;

在 #box CSS

，爲您#enemy絕對位置是相對於框。

來源

2013-04-16 14:19:00 Paulpro

將position: relative;添加到#box以使#enemy位置相對於#box。相對於它

來源

2013-04-16 14:20:28 pseudosavant

爲了#box ES孩子的位置，你可以使用以下任何根據您的要求：

#box { position: absolute; } 
#box { position: relative; } 
#box { position: fixed; }

來源

2013-04-16 14:22:09

CSS div使用座標定位

回答

相關問題