I want to make a desktop memo and I create a content editable div (Dragable as well).
If I try to edit it, that works. However, if I try to use hotkeys or Enter, it goes badly.
And Enter will return "Ret" and may launch apps on the desk.
Here is my code.
`
<style>
#mytextbox {
width: 200px;
height: 100px;
background-color: #f2f2f2;
border: 1px solid #ccc;
padding: 10px;
position: absolute;
left: 0;
top: 0;
cursor: move;
}
</style>
Drag me around and edit me!
<script type="text/javascript">
var mytextbox = document.getElementById("mytextbox");
var isDragging = false;
var dragStartX, dragStartY;
mytextbox.addEventListener("mousedown", function(event) {
isDragging = true;
dragStartX = event.clientX - mytextbox.offsetLeft;
dragStartY = event.clientY - mytextbox.offsetTop;
mytextbox.style.cursor = "move";
});
document.addEventListener("mousemove", function(event) {
if (isDragging) {
mytextbox.style.left = (event.clientX - dragStartX) + "px";
mytextbox.style.top = (event.clientY - dragStartY) + "px";
}
});
document.addEventListener("mouseup", function(event) {
isDragging = false;
mytextbox.style.cursor = "default";
});
</script>
`