JSFiddle - React, Tailwind, and code Playground
HTML
<html>
<head>
</head>
<body>
<div id="div1" style="position: fixed; left: 0; width: 100%; height: 95%; border: 1px red solid; overflow: auto">
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
Lorem ipsum<br/>
...
JavaScript
var d1 = document.getElementById('div1'),
d2 = document.getElementById('div2');
function s() {
var p = (d1.scrollHeight - d1.clientHeight) / d1.scrollTop,
x = (d2.scrollHeight - d2.clientHeight) / p;
d2.scrollTop = Math.round(x);
}
d1.onscroll = s;