Skip to content

Instantly share code, notes, and snippets.

@viller239
Last active August 16, 2016 13:57
Show Gist options
  • Select an option

  • Save viller239/92d70b6f7ccc44183d2532189e2ceebe to your computer and use it in GitHub Desktop.

Select an option

Save viller239/92d70b6f7ccc44183d2532189e2ceebe to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<style>
.ce { border: 1px solid green; background: white; width: 200px; height: 200px; float: left; }
.ce > div { padding: 5px; }
.log { border: 1px solid black; background: white; width: 200px; height: 200px; float:left; margin-left: 20px; }
</style>
</head>
<body>
<div>Type into first box</div>
<br>
<div class="ce" contenteditable="true"><div></div></div>
<div class="log"></div>
<script>
var ce = document.querySelector('.ce');
var log = document.querySelector('.log');
ce.addEventListener('click', function () {
ce.firstElementChild.focus();
});
setInterval(function() {
console.log(ce.firstElementChild);
if (ce.firstElementChild && ce.firstElementChild.innerText.length > 0) {
log.appendChild(ce.firstElementChild);
ce.innerHTML = '<div></div>';
ce.firstElementChild.focus();
}
}, 2500);
</script>
<div id="cnt"></div>
<script>
var cnt = document.querySelector('#cnt');
var i = 1;
(function tick() {
cnt.innerHTML = i;
i += 1;
setTimeout(tick, 500);
}())
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment