通过拖动选择单元格垂直或水平在表格上

Question

这是我的example 我需要实现一种方法，在该方法中可以水平或垂直分配1到4个单元 任何人都可以帮助我吗？）

我正在寻找这个question，但我不明白我怎么能改进它的例子：）

.custom {
  display: table;
  margin: 15% auto 15% auto;
  width: 75%;
  max-height: 75%;
  background-color: aqua;
  border: 4px double black;
}
.custom-cell {
  position: relative;
  width: 25%;
  float: left;
  height: 25%;
  padding-bottom: 25%;
  background: radial-gradient(red, black)
}
.custom-cell-clicked {
  position: relative;
  width: 25%;
  float: left;
  height: 25%;
  padding-bottom: 25%;
  background: radial-gradient(black, red)
}

<div class="custom">
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
</div>