jQuery的灯箱中心

Question

我有我的收藏中心位置的一个问题。

在右上角这个DEMO

您可以点击按钮，然后你看到的灯箱。

我可以将它设置这个CSS的灯箱位置：

.elight{ 
    position:fixed; 
     top:0px; 
     left:0px; 
     width:100%; 
     height:100%; 
     background:#fff; 
     opacity: .0; 
     filter:alpha(opacity=0); 
     z-index:300; 
     display:none; 
} 
.eall_in_one{ 
    position:absolute; 
     top:10%; 
     left:28%; 
     width:600px; 
     height:auto; 
     padding-bottom:20px; 
     background:#fff; 
     z-index:500; 
     padding:0; 
    -webkit-box-shadow: 0px 0px 25px 0px rgba(50, 50, 50, 0.53); 
    -moz-box-shadow: 0px 0px 25px 0px rgba(50, 50, 50, 0.53); 
     box-shadow:   0px 0px 25px 0px rgba(50, 50, 50, 0.53); 
    display:none; 
} 

，但它是不是有效。

的问题是位置。例如，如果单击此按钮时单击下面的按钮，页面将自动向上移动。

我希望我能表达我自己。

Answer 1

试试这个

.eall_in_one{ 
     position:absolute; 
     top:10%; 
     left:50%; 
     width:600px; 
     height:auto; 
     padding-bottom:20px; 
     background:#fff; 
     z-index:500; 
     margin-left: -300px; 
     padding:0; 
    -webkit-box-shadow: 0px 0px 25px 0px rgba(50, 50, 50, 0.53); 
    -moz-box-shadow: 0px 0px 25px 0px rgba(50, 50, 50, 0.53); 
     box-shadow:   0px 0px 25px 0px rgba(50, 50, 50, 0.53); 
     display:none; 
}