CSS JQuery Div相對於窗口大小的起始位置

Question

我有一個很長的單頁面布局。 包含所有內容的主容器div設計為靠近頁面底部開始（白色框，從底部窺視剛好足以看到徽標，在用戶必須滾動查看更多內容之前）。

問題是不同的屏幕尺寸和不同尺寸的瀏覽器，主容器div從頂部開始處於不同的高度，顯示出比用戶第一次到達時的預期更多或更少。

我的想法是我將需要使用js來計算window.height，減去我想要最初顯示的容器數量的高度，然后將所有這些包裝在跟蹤瀏覽器大小變化的事件處理程序中。

然而，我是Jquery的菜鳥，無法弄明白。 任何可用的示例或教程都將引領潮流？

Answer 1

為此做了一個小提琴： http ： //jsfiddle.net/QQaZp/1/

基本上，設置你想要的任何位置（我只是使用div，但你應該使用#whateverID）在你的CSS中定位絕對值。 在javascript中加載和調整大小時，只需將top屬性設置為$(window).height()是什么（我從中減去了50px，所以它$(window).height() ）

Answer 2

如果我理解正確，您不需要JavaScript。 將div從頂部完全放置100％，然后將margin-top設置為負值。

CSS：

body, html {height: 100%;}

.section-1 {
    margin-top: -60px; /* Whatever value you want peeking out */
    position: absolute;
    top: 100%;
}

在這里查看一個有效的JSFiddle： http ： //jsfiddle.net/dsundy/5kt8P/1 。