Markdown
Preview
', `${scrollScript}`); const doc = preview.contentWindow.document; doc.open(); doc.write(html); doc.close(); } catch (e) { console.error(e); } } let timer; input.addEventListener('input', () => { clearTimeout(timer); timer = setTimeout(render, 300); }); render(); const resizer = document.getElementById('resizer'); const editorPane = document.getElementById('editorPane'); const workspace = document.getElementById('workspace'); let isResizing = false; resizer.addEventListener('mousedown', (e) => { isResizing = true; resizer.classList.add('resizing'); preview.style.pointerEvents = 'none'; document.body.style.cursor = 'col-resize'; }); document.addEventListener('mousemove', (e) => { if (!isResizing) return; const containerWidth = workspace.offsetWidth; const newEditorWidth = (e.clientX / containerWidth) * 100; if (newEditorWidth > 15 && newEditorWidth < 85) { editorPane.style.width = newEditorWidth + '%'; } }); document.addEventListener('mouseup', () => { if (isResizing) { isResizing = false; resizer.classList.remove('resizing'); preview.style.pointerEvents = 'auto'; document.body.style.cursor = 'default'; } }); function setMode(mode) { document.querySelectorAll('.view-switcher .view-btn').forEach(btn => { btn.classList.toggle('active', btn.dataset.mode === mode); }); const mobMode = mode === 'split' ? 'editor' : mode; document.getElementById('mob-edit').classList.toggle('active', mobMode === 'editor'); document.getElementById('mob-prev').classList.toggle('active', mobMode === 'preview'); document.body.classList.remove('mode-split', 'mode-single', 'show-editor', 'show-preview'); if (mode === 'split') { document.body.classList.add('mode-split'); } else { document.body.classList.add('mode-single'); document.body.classList.add('show-' + mode); } }