|
01.12.2014, 15:40 | #1 |
Senior Member
Регистрация: 30.05.2011
Возраст: 50
Сообщений: 291
Вес репутации: 0 |
Re: ВЕБ МОРДА
Кнопки делаем двух фиксированных размеров. Больше не нужно.
Первый 100Х100 пикселей под кнопки с иконками. Второй 100Х210 пикселей под кнопки с надписями. Размер, изображение и надписи кнопки берут из модулей. Для красоты изображение динамическое (Пример). Либо отображают какие то данные из модуля (примерно так). Так как это и сделано в Metro UI в Windows 8. Окна модулей открываются таким образом. В правом верхнем углу модуля есть кнопка закрытия окна модуля и возврата в главное меню. Заготовка для интерфейса меню (demo.zip). Перемещаете кнопки так как вам надо, нажимаете кнопку "Получить параметры" и вносите изменения в файл index.html. Параметр data-row отвечает за смещение сверху вниз. Параметр data-col отвечает за смещение слева направо. Автоматизировать это можно таким образом. Скрипт отлавливает окончание перемещения кнопки (событие "Stop") и сохраняет положение в файл. Расположение кнопок читается из этого файла. В результате этого все изменения по расположению кнопок в меню сохраняются. Из примера выше взял заготовку для скрипта отлавливающего окончание перемещения кнопки: Код:
<script type="text/javascript"> var gridster; $(function(){ var log = document.getElementById('log'); gridster = $(".gridster ul").gridster({ widget_base_dimensions: [100, 55], widget_margins: [5, 5], draggable: { stop: function(e, ui, $widget) { log.innerHTML = 'STOP' + "<br >" + log.innerHTML; } } }).data('gridster'); }); </script> Само меню выглядит так же как в видео про Switch Automation из этого сообщения. При нажатии кнопки "+" открываются модули. Через них можно добавлять или удалять модули в CyberWrt и ,соответственно, кнопки в главном меню. Последний раз редактировалось St@rz; 01.12.2014 в 16:32. |
03.12.2014, 11:07 | #2 |
Senior Member
Регистрация: 30.05.2011
Возраст: 50
Сообщений: 291
Вес репутации: 0 |
Re: ВЕБ МОРДА
Как лучше добавить модуль в меню?
Нужно сделать через добавление одной строки в div. Самый простой способ через вставку html в php: Код:
<?php include ("file.html"); ?> Код:
<li data-row="2" data-col="5" data-sizex="1" data-sizey="1" class="gs-w"> <?php include ("file.html"); ?> </li> Последний раз редактировалось St@rz; 03.12.2014 в 11:11. |
03.11.2014, 10:26 | #3 |
Administrator
Регистрация: 12.04.2010
Адрес: Москва
Сообщений: 9,618
Вес репутации: 9823 |
Re: ВЕБ МОРДА
|
Здесь присутствуют: 2 (пользователей: 0 , гостей: 2) | |
|
|