我想在屏幕上居中div,這樣當頁面向下/向上滾動時,div可以平滑滾動到頁面中心。我正在嘗試this code (please see jsfiddle),但不起作用。有人可以幫我嗎?謝謝。jQuery:在頁面中心保留div,即使頁面向下滾動
1
A
回答
6
爲什麼不把它標記爲position: fixed
並將其保留在那裏,無論用戶在哪裏滾動?那麼你不需要任何形式的JavaScript欺騙。
然而,要回答你目前的問題,看來你提供定心一次,你你從來沒有到窗口的滾動事件作出反應:
$(window).scroll(function() { $('#box').center(); });
7
你不需要爲jQuery的,只是使用CSS
HTML
<div id="senad">content</div>
CSS
#senad { width: 200px; height: 200px; position: fixed; top: 50%; left: 50%; border: 1px solid gray;}
這樣會保持元素居中。
1
你在這裏。更新了的document.body.scrollTop的滾動事件,並考慮
$(窗口).scroll(函數(){$( '#箱')中心();});
and within center()
top + = document.body.scrollTop;
1
使用這個插件:
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();
相關問題
- 1. 確保div在頁面加載時向下滾動
- 2. 使用jQuery滾動頁面,使用div
- 3. Jquery:從當前頁面向下滾動頁面100px
- 4. 在屏幕中間的中心div - 即使當頁面向上/向下滾動時
- 5. 在縱向和橫向頁面之間保留頁面枚舉
- 6. Fancybox在頁面滾動後向下打開頁面
- 7. Ionic 2在頁面打開時向下滾動頁面
- 8. 在滾動頁面時將頁面元素保留在視圖中
- 9. 如何使div浮動並滾動頁面中心?
- 10. jQuery Mobile:頁面滾動後向下滾動
- 11. jQuery讓div滑入滾動頁面
- 12. 如何在向下滾動頁面時保持浮動頂欄?
- 13. 如何讓div向下滾動頁面一旦到達頁面頂部?
- 14. Div向下延伸頁面
- 15. 在JQuery中,slideDown()方法可以向下滾動頁面嗎?
- 16. 將div保留在頁面頂部,但位於其他div下
- 17. Drupal:僅當頁面向下滾動時才加載頁面
- 18. jquery插件哪裏元素停留在頁面上,即使在滾動時
- 19. 即使在滾動頁面時也可以設置div全屏
- 20. 當div打開時,自動向下滾動頁面
- 21. ng-keypress事件向下滾動頁面
- 22. 開始淡出頁面向下滾動
- 23. Ghostscript不保留橫向頁面方向
- 24. 如何在頁面滾動時使H1下移頁面?
- 25. 位置div中心頁面
- 26. 如何讓jQuery show()保留在頁面
- 27. 使用jquery動態加載div頁面中的html頁面
- 28. 正試圖保留div頁面退出
- 29. 使div開始中間頁面,但隨着用戶向下滾動頁面,它仍然在頂部?
- 30. 當用戶向下滾動頁面時淡入div?
感謝,但我不能只使用CSS,因爲div的高度並不總是相同的,因此,如果高度越多,股利的一半仍然隱藏。 – billa
我想你正在使用CSS設置高度 - 那麼爲什麼不同時設置'position:fixed'? – LeeGee