<!DOCTYPE html>
<style>
body {
    height: 2000px;
    margin: 0;
}
.sticky {
    background: red;
    height: 100px;
    width: 100px;
    overflow: hidden;
    position: relative;
    top: 100px;
}
.relative {
    background: green;
    height: 100px;
    width: 100px;
    position: relative;
}
#scroller {
    left: 200px;
    top: 100px;
    height: 100px;
    width: 120px;
    overflow: auto;
    position: absolute;
}
.spacer {
    height: 1000px;
}
</style>
<script>
function doTest() {
    window.scrollTo(0, 100);
    document.getElementById('scroller').scrollTop = 100;
}
window.addEventListener('load', doTest, false);
</script>
<div class="sticky">
    <div class="relative">
    </div>
</div>
<div id="scroller">
    <div class="sticky">
        <div class="relative">
        </div>
    </div>
    <div class="spacer"></div>
</div>