絕對定位的DIV不可見

Question

我有兩個絕對定位的DIV（前一張圖像和下一張圖像）。這裏是我的結構：

<div id="sheet" onclick="close()"> 
    <div id="popover"> 
     <div id="previous-image" onclick="previous()">&laquo;</div> 
     <img src="http://cynthiawoodyardlandscapedesign.com/watermark.php?src=images/main1.jpg&x=0&y=470&opacity=50" id="popover-image" /> 
     <div id="next-image" onclick="next()">&raquo;</div> 
    </div> 
</div> 

鏈接：http://cynthiawoodyardlandscapedesign.com/

這裏是我的CSS：

#next-image { 
    position: absolute; 
    right: -100px; 
    top: 250px; 
    text-align: center; 
    line-height: 50px; 
    font-size: 50px; 
    -webkit-text-stroke: 1px black; 
    -moz-text-stroke: 1px black; 
    height: 50px; 
    width: 50px; 
    z-index: 200; 
    background: transparent; 
    color: white; 
} 
#previous-image { 
    position: absolute; 
    left: -100px; 
    top: 250px; 
    text-align: center; 
    line-height: 50px; 
    z-index: 200; 
    font-size: 50px; 
    -webkit-text-stroke: 1px black; 
    -moz-text-stroke: 1px black; 
    height: 50px; 
    width: 50px; 
    background: transparent; 
    color: white; 
} 

我的javascript：

$("#sheet").click(function() { 
    $("#sheet").animate({ 
     opacity: 0 
    }, 200, function() { 
     $("#sheet").hide(); 
    }); 
}); 

Answer 1

編輯

似乎您已忽略了您的#sheet元素的實際HTML，該元素在元素上設置了display: none，因此在圖元素內部都不可見，包括箭頭。

你的網站上的實際的HTML是：

<div id="sheet" onclick="close()" style="display: none;"> 
    <div id="popover" onclick="close()"> 
     <div id="previous-image" onclick="previous()">«</div> 
     <img src="watermark.php?src=images/main1.jpg&amp;x=0&amp;y=420&amp;opactity=50" 
     id="popover-image" onclick="close()"> 
     <div id="next-image" onclick="next()">»</div> 
    </div> 
</div> 

去除style="display: none;"會再次出現箭頭。