jQuery：在頁面中心保留div，即使頁面向下滾動

Question

我想在屏幕上居中div，這樣當頁面向下/向上滾動時，div可以平滑滾動到頁面中心。我正在嘗試this code (please see jsfiddle),但不起作用。有人可以幫我嗎？謝謝。

Answer 1

爲什麼不把它標記爲position: fixed並將其保留在那裏，無論用戶在哪裏滾動？那麼你不需要任何形式的JavaScript欺騙。

然而，要回答你目前的問題，看來你提供定心一次，你你從來沒有到窗口的滾動事件作出反應：

$(window).scroll(function() { $('#box').center(); }); 

Answer 2

你不需要爲jQuery的，只是使用CSS

HTML

<div id="senad">content</div> 

CSS

#senad { width: 200px; height: 200px; position: fixed; top: 50%; left: 50%; border: 1px solid gray;} 

這樣會保持元素居中。

Answer 3

你在這裏。更新了的document.body.scrollTop的滾動事件，並考慮

http://jsfiddle.net/8Dupa/4/

$（窗口）.scroll（函數（）{$（ '＃箱'）中心（）;}）;

and within center（）

top + = document.body.scrollTop;

Answer 4

使用這個插件：

jQuery.fn.center = function(){ 
this.css("position","absolute"); 
this.css("top","50%"); 
this.css("left","50%"); 
this.css("margin-top","-"+(this.height()/2)+"px"); 
this.css("margin-left","-"+(this.width()/2)+"px"); 
return this;} 

$("#id").center();