<!DOCTYPE html>
<div id=one style="width: 100px; height: 100px; direction: ltr; overflow: scroll;">
  <div style="width: 192px; height: 192px; border: 4px solid black;"></div>
</div>
<div id=two style="width: 100px; height: 100px; direction: rtl; overflow: scroll; margin-top: 1em;">
  <div style="width: 192px; height: 192px; border: 4px solid black;"></div>
</div>
<script>
document.body.offsetTop;
one.style.direction = "rtl";
two.style.direction = "ltr";
</script>