Как программно выбрать ползунок resize?

Нужно при зажатии мыши в зеленой области расширять или сужать левый блок,я решил это реализовать с помощью resize свойства,которое делает блок расширяемым с помощью ползунка(как у textarea).Но проблема в том,что тогда блок расширяется только при зажатии только этого ползунка снизу,поэтому я решил,что нужно отслеживать зажатие мыши в зеленой области и одновременно с ним выделять и этот ползунок,но я не знаю как это сделать введите сюда описание изображения


Ответы (2 шт):

Автор решения: Danil Apsadikov

Ты можешь использовать для этого css

::-webkit-resizer {
  border: 2px solid black;
  background: red;
  box-shadow: 0 0 5px 5px blue;
  outline: 2px solid yellow;
}
→ Ссылка
Автор решения: puffleeck

блок расширяется только при зажатии только этого ползунка снизу

т.е. само действие полностью устраивает, но нужно чтоб оно срабатывало при драге любой части границы блоков, верно?

<div id='conteiner'>
  <div id='ch1'>1</div>
  <div onMouseDown='lisenMouse();'>resizer</div>
  <div id='ch2'>2</div>
</div>

где lisenMouse() - слушалка координат мыши, как раз такая как надо тут(на этом сайте) к нижней границе тектового поля прилеплена. с одним небольшим но, эта слушает вертикальную ось, тебе же нужна горизонтальная.

p.s. не силён в координации мыши, так что готового примера у меня нет.

// если никто раньше не подскажет, погугли какой нибудь js - dragNdrop скрипт например.

→ Ссылка