Pavel O

Проверь работу createTreeDom(), вызов данной функции происходит бесконечно, пока браузер не вывалит ошибку, как раз которая наблюдается в консоли. (это однозначно)

Предположу, что if (!Object.keys(obj).length) return; работает не так как ожидается. (это не проверял)

И последнее. Если ты используешь parent_id, то необходимо перед применением createTreeDom() данные превратить в древовидную структуру и только потом отдавать их в createTreeDom(). Сейчас же они просто идут общим списком.

Я бы предложил изображение и контейнер с текстом сделать display: inline-block; и vertical-align: middle;

Например
unitegallery.net

Частенько вообще не использую < select > а делаю так https://jsfiddle.net/gans5131/sdw7as5w/
Но это подойдет, только если отправка данных происходит по средствам ajax.

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

к сожалению ответа не нашел, но вот что заметил
при отключении анимации, например animation-duration: 1s; у .looper
overflow: hidden; срабатывает

menu li:hover>ul{
  display: block;
}

Думаю стоит использовать сессии.
Переменная в сессии будет говорить о том, подключать стили адаптивной верстки или десктопной.
Т.е.
- есть кнопка "Полная версия"
- нажимаем
- либо аяксом, либо с помощью формы мы запускаем скрипт который в созданную нами переменную сессии лепит, что мы мол теперь десктоп
- перезагружаем страничку
- в шаблоне темы должна быть заложена логика, которая проверяет переменную сессии, в которую мы пишем состояние сайта и в зависимости от её значения дает стили десктопа или адаптивки

Обычно в таких случаях я использую inline-block или задаю фиксированную высоту блоков. Можно использовать ваш вариант с CLEAR, но в таком случае могут возникнуть проблемы в реализации адаптивной верстки.

https://jsfiddle.net/gans5131/gnx7rpf3/

Может понравится

Я вижу на картинке шрифт во всю ширину, это:
text-align: justify;
Хотя это считается плохим тоном.