simditor-markdown icon indicating copy to clipboard operation
simditor-markdown copied to clipboard

Markdown编辑和预览能否左右分屏

Open rockliuxn opened this issue 8 years ago • 1 comments

如题, 编辑时上下分屏,这样不能实时看到编辑结果,要来回的上下滚屏才能预览,这样非常不方便,左右分屏的话就很好,希望采纳!

rockliuxn avatar Apr 13 '16 05:04 rockliuxn

可以的。 @rockliuxn 官方好像是不支持,不过可以通过自己修改源码实现Markdown编辑左右分屏。

以下是我的个人实践,在 simditor-markdown.js 文件中添加如下代码:

SimditorMarkdown.prototype.command = function() { var button, i, len, ref;

    $(".markdown-editor").css("display", "inline-block")
        .css("width", "50%")
        .css("height", "100%")
        .css("min-height", "500px")
        .css("float", "left");
    $(".simditor .markdown-editor textarea").css("min-height", "500px");

    $(".simditor-body").css("display", "inline-block")
        .css("width", "50%")
        .css("height", "100%")
        .css("min-height", "500px")
        .css("float", "right");

this.editor.blur();

......

} else { this.textarea.val(''); this.editor.body.attr('contenteditable', 'true');

      $(".markdown-editor").removeAttr("style");
      $(".simditor-body").removeAttr("style");

}

下面是源码修改后的效果图:

image

iamroma avatar May 27 '16 06:05 iamroma