Skip to content

Instantly share code, notes, and snippets.

@walfie
Created January 30, 2018 19:29
Show Gist options
  • Save walfie/d9be87c0cd492c837ada7ea57d3041d5 to your computer and use it in GitHub Desktop.
Save walfie/d9be87c0cd492c837ada7ea57d3041d5 to your computer and use it in GitHub Desktop.
Basic HTML edit/preview bookmarklet
(function(d) {
d.open();
d.write('<textarea id="input" spellcheck="false" style="flex:1;height:100%;resize:none;outline:none;font:15px monospace;color:#fff;background:#111;padding:10px;"><html>\n<head></head>\n<body>\nClick here to render\n</body>\n</html></textarea>');
d.write('<iframe id="iframe" style="flex:1;height:100%;"></iframe>');
d.close();
var s = d.body.style;
s.display = 'flex';
s.margin = 0;
var i = d.getElementById('input');
i.onkeydown = function(e) {
if ((e.keyCode || e.which) != 9) {
return;
}
e.preventDefault();
var s = this.selectionStart;
this.value = this.value.substring(0, s) + " " + this.value.substring(this.selectionEnd);
this.selectionEnd = s + 2;
};
i.select();
var ifr = d.getElementById('iframe');
i.addEventListener('click', function() {
var idoc = ifr.contentWindow.document;
idoc.open();
idoc.write(i.value);
idoc.close();
});
d.title = 'Textarea';
}(document));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment