CSS3：我如何獲得像「絕對」但不是的工作？

我有一個遊戲會去哪裏，當你擊中你的對手時，你正在做什麼，以顯示你的照片。我使用的絕對位置，這個工程，但我遇到了一個問題，問題是，如果我調整窗口的大小，或者我在另一個決議，這些點不是我如何建立起來他們把我的命中splats在相對模式只有移動的東西左右。那麼，怎樣才能讓我的hitsplats在中心像他們現在有絕對的，但還沒有讓他們絕對絕對？於是，他們與文檔流？CSS3：我如何獲得像「絕對」但不是的工作？

#npchitbox { 
    width: 50px; 
    height: 50px; 
    position: absolute; 
    background-color:blue; 
    z-index: 11; 
    top: 100px; 
    left: 1050px; 
    text-align: center; 
    font-weight: bold; 
    font-size: 50px; 
    color: red; 
    }

這裏是HTML代碼

<div id="playerbox"> 
    <div id="hitbox"> </div>

來源

2013-10-31 Shawn

使用'offsetLeft'和'offsetTop'計算對手的位置，並應用。這也可能有助於使容器定位（但只要偏移父母相同，它確實無關緊要） – Ryan

如果使用JavaScript，這將非常簡單。您可以將偵聽器綁定到窗口大小調整事件，並根據'＃playerbox'的偏移量設置CSS頂部和左側，就像@minitech所說的那樣。 –

你可以顯示html，並且你只是試圖將hisplate居中嗎？如果是這樣做的話

{ 
margin: auto; 
position: absolute; 
top: 0; bottom:0; right:0; left:0; 
}

來源

2013-10-31 02:14:50 user2726228

我試過了，沒有工作:( – Shawn

嘗試增加這容器的CSS爲hitsplat/DIV擊中格：

position:relative;

應該使擊中格位置絕對的容器，而不是窗戶。

從理論上講，它應該將容器從瀏覽器窗口移動到您指定位置的任何div /容器：相對於。 jQuery中

來源

2013-10-31 03:36:30

使用resize事件，以它適合確切位置時，窗口大小

$(window).resize(function() { 
    $("#hitbox").attr("top", ($(window).height()-50) +"px"); 
//since 50 is the size of the box you are using 
});

來源

2013-10-31 05:45:05 lopa

CSS3：我如何獲得像「絕對」但不是的工作？

回答

相關問題