http://hugoware.net/snippets/jquery-dual-scroll
html
css
.div01{width:200px;height:200px;overflow-y:auto;background:#000;color:#fff;} .div02{width:200px;height:200px;overflow-y:auto;background:#000;color:#fff;}
jQuery
var tbox1 = $('.tlans-box .txt-box .txtarea-view.tbox1'); var tbox2 = $('.tlans-box .txt-box .txtarea-view.tbox2'); var height = parseInt(tbox2.css('height')); var hold = false; var window_scroll = true; tbox1.add(tbox2) .mouseenter(function() { window_scroll = false; }) .mouseleave(function() { window_scroll = true; }); var locked = false; var sync_to = function(source, target) { if (locked) { return locked = false, true; } locked = true; var percent = source.scrollTop() / (source[0].scrollHeight - height); var top = (target[0].scrollHeight - height) * percent; target[0].scrollTop = top; } tbox1.scroll(function(e) { sync_to.call(e, tbox1, tbox2); }); tbox2.scroll(function(e) { sync_to.call(e, tbox2, tbox1); });