Всем привет. Уже второй день пытаюсь решить проблему.
Надеюсь кто-нибудь все таки разъяснит, как лучше всего построить алгоритм выравнивания, либо предоставит ссылки на готовые js библиотеки, которые подобным занимаются.
Задача заключается в следующем:
У нас есть область с определенными размерами, в нашем случае это 1015x530. Она разделена пополам.
В левой части находятся изображения (div по умолчанию имеет высоту равную 200px и абсолютное позиционирование, а само изображение max-height 100%).
Каждое добавленное в область изображение накладывается друг на друга.
Необходимо при клике расположить изображения максимально грамотно, изменяя их размеры, относительно половины площади области и выровнять по центру.
Иными словами, сейчас так:
Нужно, чтобы скрипт старался максимально ровно все выровнять:
Быдло-код, который я написал, пытаясь решить эту проблему работает не так как нужно. Все выглядит примерно так:
https://i.gyazo.com/ea3bfa13856d58f4f086d7b4b66f3b...
https://jsfiddle.net/txo4uryc/
Заранее большое за любую помощь!