粘性模式更改它的放大/缩小位置和浏览器调整大小

Question

我的模式有问题。当使用jquery单击按钮时，我已经完成了向下滑动操作。现在我的问题是每当我放大，缩小或调整我的浏览器模式更改的位置。我希望模态坚持我想要的位置。这里是我的代码：

<script> 
$(document).ready(function(){ 
$("#login").click(function(){ 
$("#form").slideDown(400); 
}); 
    $("#close").click(function(){ 
$("#form").slideUp(400); 
}); 
}); 
</script> 

<style type="text/css"> 
#form 
{ 
display:none; 
position:absolute !important; 
top:300px !important; 
left:820px !important; 
margin-top:-120px !important; 
margin-left:-500px !important; 
z-index:101; 
} 
</style> 

正如你可以在我的代码在上面看到的，我使用顶部和左侧固定我的CSS模式的位置。但是，当我缩小/放大或调整浏览器大小时，位置会发生变化。我怎样才能让它坚持在一个固定的位置？任何帮助，将不胜感激。

更新：我自己修复它。我只需要在css中删除一些代码。这里是新的CSS代码：

<style type="text/css"> 
#form 
{ 
display:none; 
position:absolute !important; 
z-index:101; 
} 
</style> 

希望这有助于每个人都有同样的问题。

Answer 1

使用position: fixed代替absolute