javascript/css絕對位置div

Question

我得到了這個PSD設計我需要代碼爲HTML，它有一個瀏覽器窗口（左側和右側）下一個和上一個導航按鈕的幻燈片，所以我想你可以只是爲兩個div執行CSS position: absolute，其中一個爲left: 0;和其他到right: 0;但他們會留在瀏覽器屏幕頂部的兩側，並根據設計，他們必須在瀏覽器屏幕垂直高度的中間。所以，我的意思是基本上例如，使用的jsfiddle：http://jsfiddle.net/ZVL8W/把這些塊：

而且他們這樣的位置：

所以我想會有可能的JavaScript包括在內，因爲這些div將裏面的一些深度div結構具有設置的寬度，所以幻燈片控制div會以某種方式需要能夠從父容器的設置寬度中移出。

Answer 1

檢查了這一點：http://jsfiddle.net/ZVL8W/3/
這有相同的高度，無論屏幕尺寸是什麼。

.left-box { 
     width: 100px; 
     height: 100px; 
     background-color: red; 
     display: block; 
     position:absolute; 
     top:50%; 
     left:0px; 
     margin-top:-50px; 
    } 
    .right-box { 
     width: 100px; 
     height: 100px; 
     background-color: blue; 
     display: block; 
     position:absolute; 
     top:50%; 
     right:0px; 
     margin-top:-50px; 
    } 

Answer 2

您可以通過CSS做這一切：http://jsfiddle.net/ZVL8W/7/

.left-box { 
    width: 100px; 
    height: 100px; 
    background-color: red; 
    display: block; 
    position:absolute; 
    top:50%; 
    margin-top:-50px; 
    left:0; 
} 
.right-box { 
    width: 100px; 
    height: 100px; 
    background-color: blue; 
    display: block; 
    position:absolute; 
    left:100%; 
    margin-left:-100px; 
    top:50%; 
    margin-top:-50px; 
}