62 lines
1.1 KiB
HTML
62 lines
1.1 KiB
HTML
<html>
|
|
<head>
|
|
|
|
<style>
|
|
|
|
#mirror {
|
|
border: 1px solid gray;
|
|
/*display: inline;*/
|
|
float: left;
|
|
}
|
|
|
|
#text {
|
|
/*white-space: nowrap;*/
|
|
resize: none;
|
|
}
|
|
|
|
#mirror, #text {
|
|
font-family: sans;
|
|
font-size: 15px;
|
|
}
|
|
</style>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<textarea id="text" onkeyup="autosize(this);" onchange="autosize(this);" wrap="off">test</textarea>
|
|
|
|
<br>
|
|
|
|
<div id="mirror"></div>
|
|
|
|
<script>
|
|
function autosize(textarea) {
|
|
textarea.style.height = '0px';
|
|
textarea.style.width = '0px';
|
|
var scrollHeight = textarea.scrollHeight;
|
|
var scrollWidth = textarea.scrollWidth;
|
|
textarea.style.height = (scrollHeight + 2) + 'px';
|
|
textarea.style.width = (scrollWidth + 20) + 'px';
|
|
|
|
//textarea.style.height = 'auto';
|
|
textarea.style.overflow = 'hidden';
|
|
//textarea.style.overflow = 'auto';
|
|
|
|
mirror = document.getElementById('mirror');
|
|
mirror.innerText = textarea.value;
|
|
|
|
//console.log(mirror.clientWidth, mirror.clientHeight);
|
|
|
|
}
|
|
|
|
var text = document.getElementById('text');
|
|
autosize(text);
|
|
text.focus();
|
|
|
|
</script>
|
|
|
|
|
|
</body>
|
|
</html>
|