Как сделать dhtmlx отзывчивым?

Моя проблема: Я использую Bootstrap и DHTMLX для создания веб-приложения, приложение имеет домашнюю страницу, боковую панель и другие другие страницы, в которых я использую DHTMLX для построения макета, сетки, и я использую другие компоненты DHTMLX. Мне удалось сделать мою домашнюю страницу отзывчивой, а другие компоненты HTML отлично отображаются на разных устройствах, но моя проблема связана с расположением и сеткой DHTMLX, которая никогда не была отзывчивой! Я искал и пытался найти способ сделать его отзывчивым, поскольку у меня много страниц, но на каждой странице может быть шаблон макета DHTMLX (в основном используются 1C, 2U, 3L, 3T, 3U используются многоуровневые макеты тоже)Как сделать dhtmlx отзывчивым?

То, что я думаю, что делать: Ну, я заметил кое-что, если я сведущих динамически изменять DHTMLX макет на основе различных средств массовой информации использовали это может быть решением, например: на одной из страниц у меня есть макет 2U который отображается очень хорошо на экране рабочего стола, но его ужасно отображается на смарт-устройстве телефона - более узком носителе - поэтому 2U необходимо преобразовать в 2E, что делает его, по меньшей мере, более удобным для просмотра и использования

Мой вопрос - или вопросы -: Я думаю о самом фиктивном способе отклика моего веб-приложения, или даже в том, что я пытаюсь сделать, в том числе с концепцией «Ответственность»?

Это не обсуждение. Я не хочу, чтобы мой вопрос закрывался. Мне нужен только ответ, чтобы направить меня правильно, однако я высоко ценю дискуссию с ответом в нужном месте.

источник

2016-01-11 fo2sh

Вы должны иметь возможность использовать обработчик onresize с обработчиком onload. Вы просто должны выгрузить макет и воссоздан его каждый раз изменяет размер окна:

<script> 
    var layout 
    var currentPattern 

    function setLayout() { 
    var width = window.innerWidth 

    if (width < 600) { 
     var pattern = "2E" 
    } else { 
     var pattern = "2U" 
    } 

    if (pattern == currentPattern) { 
     return 
    } else { 
     currentPattern = pattern 
    } 

    if (layout) { 
     layout.unload() 
    } 

    layout = new dhtmlXLayoutObject({ 
     parent: "your-layout-id", 
     pattern: pattern 
    }) 
    } 

    window.onresize = setLayout 
</script> 
<body onload="setLayout()"> 
    <div id="your-layout-id">...</div> 
</body>

источник

2016-01-11 09:10:10

спасибо за ваш ответ, однако думать о реализации этого решения на огромное количество страниц означает, что для каждой страницы вы должны определить расположение шаблоны на носитель – fo2sh

Просто сохраните функцию в файле javascript, который вы укажете на каждой странице? –

Да, я знаю! но я имел в виду, что не все страницы имеют шаблоны 2U, и мы должны учитывать макет внутри макетов, решение более сложное, чем это, но это начало, в любом случае я дам ему больше времени для поиска и предложений от других пользователей, thnx – fo2sh

ответ

Смежные вопросы