实现自己的 markdown 编辑器 —— 同步滚动

同步滚动是 markdown 编辑器一个基本的功能
需求是编辑区滚动时,预览区同步滚动

效果如下:


图片

具体实现如下

$("textarea#mdeditor").on('scroll', function(){
    $preview = $("div#preview");
    var percentage = this.scrollTop / (this.scrollHeight - this.offsetHeight);
    var height = percentage * ($preview.get(0).scrollHeight - $preview.get(0).offsetHeight);
    $preview.scrollTop(height);
});

你可能感兴趣的:(实现自己的 markdown 编辑器 —— 同步滚动)