Javascript-форум - Есть ли такая возможность

Цитата:

Сообщение от Neon921

Оно не дает возможности его редактировать

таскать за кружок, редактрование после клика о тексту

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
body, html{
  width: 100%;
  height: 100%;
  margin: 0;
}
.block {
   width: 100%;height: 100%;
   display: flex;
   flex-wrap: wrap;

}
.block > div {
   height: 50%;
   transition: .8s;
   box-sizing: border-box;
}


.block > div:nth-child(1){ width: 100%;
  background-color: red;

}
.block > div:nth-child(2){ width: 50%;
  background-color: yellow;
}
.block > div:nth-child(3){ width: 50%;
  background-color: green;
}

.text{
  position: relative;
  width: 100px;
  height:  auto;
  background-color:  rgba(255, 244, 148, 1);
  border: 4px solid rgba(139, 69, 19, 1);
  border-radius: 12px;
  margin: 5px;padding: 5px;
}



 .handle{
   position: absolute;
    bottom: 0px;
    right: 0px;
   display: inline-block;
   height: 10px;
   width: 10px;
   border-radius: 50%;
   background-color: rgba(0, 0, 255, 1);
 }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
  <script>
$(function() {
   $( ".block >" ).sortable({
      connectWith: ".block >",  handle : ".handle"
    });
})
  </script>
</head>

<body>
<div class="block">
  <div>
  <div class="text" ><div class="edit" contenteditable >test_01</div><span class="handle"></span></div>
  <div class="text" ><div class="edit" contenteditable >test_01</div><span class="handle"></span></div>
  <div class="text" ><div class="edit" contenteditable >test_01</div><span class="handle"></span></div>
  </div>
  <div></div>
  <div></div>
</div>



</body>
</html>