Skip to content

Instantly share code, notes, and snippets.

@longlostnick
Last active September 16, 2019 11:16
Show Gist options
  • Save longlostnick/5633086 to your computer and use it in GitHub Desktop.
Save longlostnick/5633086 to your computer and use it in GitHub Desktop.
this.editor = new wysihtml5.Editor("textarea");
this.editor.observe("load", function () {
var $iframe = $(this.composer.iframe);
var $body = $(this.composer.element);
$body
.css({
'min-height': 0,
'line-height': '20px',
'overflow': 'hidden',
})
.bind('keypress keyup keydown paste change focus blur', function(e) {
var height = Math.min($body[0].scrollHeight, $body.height());
// a little extra height to prevent spazzing out when creating newlines
var extra = e.type == "blur" ? 0 : 20 ;
$iframe.height(height + extra);
});
});
@ChristofferJoergensen
Copy link

Great piece of code. I've spend almost a day before finding this.

Do you have an idea how to perform the autoresize on load also? As it is now, the first resize does not happen until you click to activate the textarea.

@andrewkouri
Copy link

Doesn't work with wysihtml5

@squalldragon
Copy link

Don't forget to set a default height on iframe body for it to work otherwise the scrollHeight is miscalculated.

@MohdRif
Copy link

MohdRif commented Sep 16, 2019

awesome piece of code, thanx for sharing.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment