JSFiddle - React, Tailwind, and code Playground
by the94air
HTML
<script src="https://cdn.rawgit.com/asvd/syncscroll/ba626275/syncscroll.js"></script>
<div id="app">
<div class="syncscroll" name="syncscroll">{{ message }} Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione deleniti necessitatibus mollitia voluptatem sapiente iste quo, earum iure sit obcaecati quisquam fugit, laborum id quibusdam adipisci possimus cumque repellendus reprehenderit.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione deleniti necessitatibus mollitia voluptatem sapiente iste quo, earum iure sit obcaecati quisquam fugit, laborum id quibusdam adipisci possimus cumque repellendus
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione deleniti necessitatibus mollitia voluptatem sapiente iste quo, earum iure sit obcaecati quisquam fugit, laborum id quibusdam adipisci possimus cumque repellendus reprehenderit.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione deleniti necessitatibus mollitia voluptatem sapiente iste quo, earum iure sit obcaecati quisquam fugit, laborum id quibusdam adipisci possimus cumque repellendus reprehenderit.</div>
<div class="syncscroll" name="syncscroll">{{ message }} Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione deleniti necessitatibus mollitia voluptatem sapiente iste quo, earum iure sit obcaecati quisquam fugit, laborum id quibusdam adipisci possimus cumque repellendus reprehenderit.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione deleniti necessitatibus mollitia voluptatem sapiente iste quo, earum iure sit obcaecati quisquam fugit, laborum id quibusdam adipisci possimus cumque repellendus reprehenderit.</div>
</div>
CSS
#app {
height: 100%;
}
div {
width: 200px;
height: 100px;
overflow: auto;
display: inline-block;
}
Vue
new Vue({
el: '#app',
data: {
message: 'hello world!'
}
});