スクロールに従って位置を変更してください

Question

私のスクロールに従って位置を変更したいと思います。 そして写真は千の言葉を話すので、ここで私が欲しいものです：

そしてここでは、私のコードです：https://jsfiddle.net/njz87Lth/1/

HTML：

<h1> MY TEXT. orem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </h1> 
<div class="one"> </div> 
<div class="two"> </div> 

はCSS：

body { 
    text-align:center; 
} 

h1 { 
    left: 0; 
    line-height:2; 
    right:0; 
    width:600px; 
    margin-left: auto; 
    margin-right: auto; 
    position:fixed; 
} 

.one, .two { 
    width:600px; 
    position: absolute; 
    left: 0; 
    right:0; 
    margin-left: auto; 
    margin-right: auto; 
} 

.one { 
    top:100px; 
    height:300px; 
    background:grey; 
} 

.two { 
    height:800px; 
    background:pink; 
    margin-top:30px; 
    top:400px; 
} 

Answer 1

jQueryを使って試してみてください。

$(window).scroll(function() { 
    $(".one").offset({ left: left, top: top}); 

}); 

offsetの値を必要に応じて指定します。