Разделитель на JS?

Question

[Владислав Поляков]

На сайте Jsfiddle , реализована система состоящая из 4 окон и разделителями между ними, разделители меняют размер окон в процентном отношении, подскажите пример такого splitter'a , именно для 4 окон. Пробовал использовать

jquery-resizable
Version 0.17 - 3/31/2016

но он меняет в числовом значении.
Пробовал модернизировать , но в процентах изменяется только вертикальный

if (!opt.onDrag || opt.onDrag(e, $el, newWidth, newHeight, opt) !== false) {
                    if (opt.resizeHeight)
                        $el.height((newHeight / $el.parent().height() * 100).toString() + '%');

                    if (opt.resizeWidth)
                        $el.width((newWidth / $el.parent().width() * 100).toString() + '%');
                }

Answer 1

[Алексей Зуев]

Один из многих вариантов
Ссылка на github

Comments

[Владислав Поляков]

То, что нужно , 2 часа подобное искал. А есть подобное но реализованное на flexbox ?

Answer 2

[Сергей]

Слайдер? Слайдер это когда фотки меняются друг за другом.
Вам нужно Drag & Drop решение. Вот например https://jqueryui.com/draggable/#constrain-movement . По событию меняются значения ширины и высоты элементов. Ничего сложного

Comments

[Владислав Поляков]

Сплитер , ошибся.

[Сергей]

Владислав Поляков: https://jqueryui.com/resizable/#synchronous-resize вот еще решение похожее

[Владислав Поляков]

Прикольно выглядит , но это мне не подходит.

[Сергей]

Владислав Поляков: сплитер) ключевое слово в гугле, тоже не вспомнил как нахывается, первое же решение https://plugins.jquery.com/splitter/ )

[Сергей]

Демка там вообще на 7 блоков вроде

[Владислав Поляков]

Сергей: Там тоже в числах . При изменении размера экрана , лучше в процентных значениях

[Сергей]

Владислав Поляков: Переписать недолго. Я думаю скрипуту фиолетово в чем давать значения

[Владислав Поляков]

Сергей: Я в статье написал , что переписал , но по непонятным мне причинам , работал только вертикальный сплитер