無法在頂部div中滾動

Question

當光標位於頂部的藍色塊上時無法滾動，關於我要去哪裏的錯誤的任何想法？

JSFiddle Demo

HTML

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

    <div class="content"> 
     content 
    </div> 
</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; 
} 
.wrapper { 
    position: absolute; 
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    } 

JS

$(".wrapper").scrollTop(300); 

Answer 1

您已經使用CSS position: Fixed;，因此類block將不會從它的位置移動和滾動條將不會mousehover事件

HTML

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

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

</div> 

CSS

body { 
    margin: 0px; 
    padding: 0px; 
} 
.block { 
    background: blue; 
    height: 300px; 
    width: 100%; 
    position: absolute; 
} 
.content { 
    background: red; 
    margin-top: 300px; 
    top: 0; 
    width: 100%; 
    height: 100%; 
    z-index: 100; 
    position: absolute; 
} 
.wrapper { 
    background: #ccc none repeat scroll 0 0; 
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    } 

工作

JS

$(".wrapper").scrollTop(300); 

這裏是fiddle

Answer 2

你有位置被固定類塊它會阻止滾動條的工作。所以改變類塊的位置。

Answer 3

去掉包裝的div，並添加 「身體」 的javascript

更新 http://jsfiddle.net/cr8uj/7/

JS

$("body").scrollTop(300); 

Answer 4

please do not use fixed property on .block class 

body { 
margin: 0px; 
padding: 0px; 
} 
.block { 
background: blue; 
height: 300px; 
width: 100%; 
position: absolute; 
} 
.content { 
background: red; 
margin-top: 300px; 
top: 0; 
width: 100%; 
height: 100%; 
z-index: 100; 
position: absolute; 
} 
.wrapper { 
position: absolute; 
width: 100%; 
height: 100%; 
overflow: auto; 
}