在特定點顯示頁面

我試圖在這種情況下顯示頁面從特定點（div：內容）進一步向下。在特定點顯示頁面

預期的效果將在頂部的紅色塊，但是向下滾動，就會發現以上

HTML

<div class="block"> 
    block 
</div> 

<div class="content"> 
    content 
</div>

CSS

body { 
    margin: 0px; 
    padding: 0px; 
} 
.block { 
    background: blue; 
    height: 300px; 
    width: 100%; 
    position: fixed; 
} 

.content { 
     background: red; 
     margin-top: 300px; 
     top: 0; 
     width: 100%; 
     height: 100%; 
     z-index: 100; 
     position: absolute; 
}

來源

2014-01-16 Rob

「加載」意味着從外部資源中插入內容，如AJAX調用。 –

你能指定你真正想要什麼嗎？我的理解是：當頁面顯示時，你可以看到頂部的紅色div。當你開始向下滾動時，藍色div出現在頂部（覆蓋紅色塊），並且它保持在頂部作爲固定元素。你想要嗎？ – bugovicsb

我冒昧地將「負載」改爲「顯示」，因爲它更有意義。 – MMM

您正在尋找：scrollTop的

http://api.jquery.com/scrollTop/

設置每個匹配的元素的滾動條的當前垂直位置。

例子： $('body').scrollTo('#YourDiv');

有與此相關的一個問題：jQuery scroll to element

一個好的圖書館：http://mmenu.frebsite.nl/examples/responsive/index.html

其他選項：

你需要的是JavaScript window.scrollTo方法

window.scrollTo(xpos,ypos)

插入在那裏的DIV位置。

或者使用JQuery的方法ScrollTo， see an example here

$(...).scrollTo('div:eq(YourDiv)', 800);

來源

2014-01-16 23:22:08

我已經更新了jsfiddle的建議，但似乎我無法滾動時，在藍色塊 – Rob

@Rob因爲你正在使用'寬度：100％;身高：100％'，所以沒有什麼需要滾動的，但是如果你把它做得大一點，那麼你就會出現滾動條。 –

@Rob我發現了另一個庫，請查看：http://mmenu.frebsite.nl/examples/responsive/index.html –

在特定點顯示頁面

回答

相關問題