垂直滚动同步2个Div

我正在尝试同步2个div的垂直滚动; 一个是TinyMCE编辑器的主体，另一个是动态创建的预览div。

预览看起来像这样：

对于预览div，我设法通过使用以下方式获得滚动的百分比：

setup : function(ed) { ed.on('init', function() { $('.editorContainer > .mce-tinymce > .mce-container-body').children().eq(2).on('scroll', function () { var tmceBody = ed.getBody(); console.log("this offsetHeight: " + this.offsetHeight); // 501 console.log("this scrollTop: " + this.scrollTop); // 160 console.log("this scrollHeight: " + this.scrollHeight); // 806 var percentage = this.scrollTop / (this.scrollHeight - this.offsetHeight); console.log("this percentage: " + percentage); // 0.5 -- Prev div works console.log("TMCE offsetHeight: " + tmceBody.offsetHeight); // 1009 console.log("TMCE scrollTop: " + tmceBody.scrollTop); // 14 console.log("TMCE scrollHeight: " + tmceBody.scrollHeight); // 1037 var x = percentage * (tmceBody.scrollHeight - tmceBody.offsetHeight); console.log("TMCE x: " + x); // 14.2 (tmceBody).scrollTop(x); }) } } } 

因此，当我移动预览时，编辑器会滚动但不是正确的值。

小提琴： https ： //jsfiddle.net/gm7j0e9u/3/