Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

47 lines (40 sloc) 1.559 kb
<p>The red and yellow boxes should follow the green box when you scroll any scrollbar.</p>
#container { height:1000px; }
#inner-container1 { height:200px; overflow:scroll; margin:100px 0; width:40%; }
#inner-container2 { height:200px; overflow:scroll; width:40%; position:fixed; top:185px; right:0; }
.red { width:30px; height:30px; background:red; margin:120px auto; }
.green { width:30px; height:30px; background:green; }
.yellow { width:30px; height:30px; background:yellow; }
#red0 { margin:0 0 0 50px; }
<div id="red0" class="red"></div>
<div id="green0" class="green"></div>
<div id="yellow0" class="yellow"></div>
<div id="container">
<div id="inner-container1">
<div id="red1" class="red"></div>
<div id="green1" class="green"></div>
<div id="inner-container2">
<div id="red2" class="red"></div>
<div id="green2" class="green"></div>
<div id="yellow1" class="yellow"></div>
<div id="yellow2" class="yellow"></div>
<script src="/depender/build?require=More/Element.Position,Core/Element.Event"></script>
var position = function(){
$('green' + post).position( {relativeTo: $('red' + post), position: 'centerRight', edge: 'centerLeft'});
$('yellow' + post).position({relativeTo: $('red' + post), position: 'centerLeft', edge: 'centerRight'});
window.addEvent('scroll', position);
$('inner-container1').addEvent('scroll', position);
$('inner-container2').addEvent('scroll', position);
Jump to Line
Something went wrong with that request. Please try again.