Дизайн сцен 2
Модератор: immortal
- Vovix
- Сообщения: 1155
- Зарегистрирован: Пн янв 27, 2014 1:43 am
- Откуда: г.Ижевск
- Благодарил (а): 60 раз
- Поблагодарили: 532 раза
- Контактная информация:
Re: Дизайн сцен 2
темка убежала...
а полезная ведь!
а полезная ведь!
Мой -CONNECT-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
-
- Сообщения: 4
- Зарегистрирован: Сб сен 10, 2016 3:55 pm
- Откуда: Россия, Стерлитамак
- Благодарил (а): 1 раз
- Поблагодарили: 0
Re: Дизайн сцен 2
Простите за невежество, но я ни как не пойму как запустить обсуждаемую сцену на планшете. Majordomo установлен на ноутбуке. Сцену я настроил. Пока не полностью, а только главную страницу и погоду. Еще добавил страницу с GPS, но пока не разобрался с выводом карты (я так понял, что карту должен подгружать планшет за счет встроенного GPS). Поправьте, если что не так. На планшете установил Majordroid. Настроил локальную сеть. Как-бы связь с сервером есть. Как вывести на планшете сцены во весь экран? Пересмотрел кучу видео на youtube, но там только инфа, как настроить саму сцену, а вот работа с планшетом ни где не описана.
windows 7 x64, MajorDomo
- Vovix
- Сообщения: 1155
- Зарегистрирован: Пн янв 27, 2014 1:43 am
- Откуда: г.Ижевск
- Благодарил (а): 60 раз
- Поблагодарили: 532 раза
- Контактная информация:
Re: Дизайн сцен 2
В общем-то если вы посмотрели видео на youtube по адаптации темы - https://www.youtube.com/watch?v=ZRWDUY4UZfY&t=1106s , то там все есть,platon70 писал(а):Простите за невежество, но я ни как не пойму как запустить обсуждаемую сцену на планшете.......
но тем не менее:
Majordroid вам по сути не нужен (хотя можно и с ним),
на вашем планшете нужен браузер, а чтобы на экране не было ни чего лишнего кроме отображения сцены, браузер нужен в так называемом "режиме киоска" (рекомендую погуглить для своего браузера).
Ну и в браузере запускаете страницу вашей сцены вида: xxx.xxx.xxx.xxx/popup/scenes/YY.html
где xxx.xxx.xxx.xxx - ip в локальной сети вашей
YY.html - YY это ID вашей сцены.
- Рейтинг: 2.33%
Мой -CONNECT-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
Windows 7(PHP 7.2) + Raspberry Pi(освещение на 1-Wire) + MP751(управление) + ESP8266(сенсоры) + LAN(сенсоры)
-=: Если вам помогло моё сообщение, нажмите кнопку "Поблагодарить за сообщение автора: Vovix" (кнопка Спасибо) справа! :=-
-
- Сообщения: 4
- Зарегистрирован: Сб сен 10, 2016 3:55 pm
- Откуда: Россия, Стерлитамак
- Благодарил (а): 1 раз
- Поблагодарили: 0
Re: Дизайн сцен 2
Вот это дело. Теперь все понятно!Vovix писал(а): Ну и в браузере запускаете страницу вашей сцены вида: xxx.xxx.xxx.xxx/popup/scenes/YY.html
где xxx.xxx.xxx.xxx - ip в локальной сети вашей
YY.html - YY это ID вашей сцены.
windows 7 x64, MajorDomo
- adzam
- Сообщения: 602
- Зарегистрирован: Сб дек 08, 2012 10:28 pm
- Откуда: Кишинев
- Благодарил (а): 20 раз
- Поблагодарили: 138 раз
Re: Дизайн сцен 2
А как сделать чтоб картирка менялась каждые 5 минут в произвольном порядке из папки с картинками?Dark_Veter писал(а):Я следующим образом сделал:Aleks130699 писал(а):Мне интересно как сделать изменяющийся фон))Просто я в программировании еще не сильно разобрался))
1. Положил нужные картинки в cms/scenes/backgrounds/
2. Создал сценарий getSceneImage со следующим кодом (картинки в массивах надо будет поменять на нужные).3. Создал сцену и в строке фоновое изображение указал созданный выше сценарий:Код: Выделить всё
if($params['scene'] == "weather") { $winter = array("cms/scenes/backgrounds/winter_1067x640.jpg"); $spring = array("cms/scenes/backgrounds/spring_1067x640.jpg"); $summer = array("cms/scenes/backgrounds/summer_1067x640.jpg"); $autumn = array("cms/scenes/backgrounds/autumn_1067x640.jpg", "cms/scenes/backgrounds/weather_1067x640.jpg"); $seasons = array(0 => $winter, 1 => $spring, 2 => $summer, 3 => $autumn); $season = $seasons[floor(date('n') / 3) % 4]; $img = $season[rand(0, count($season) - 1)]; if (file_exists($img)) { header("Content-type: image/jpg"); readfile($img); } } else { $images = array("cms/scenes/backgrounds/weather_1067x640.jpg", "cms/scenes/backgrounds/city_1067x640.jpg", "cms/scenes/backgrounds/plants_1067x640.jpg"); $img = $images[rand(0, 2)]; if (file_exists($img)) { header("Content-type: image/jpg"); readfile($img); } }
В принципе код можно еще оптимизировать и уменьшить, но я пока этим не заморачивался.Код: Выделить всё
/objects/?script=getSceneImage&scene=weather
Мои проекты здесь...https://connect.smartliving.ru/profile/41/blog213.htm
Если вам помогло какое-либо мое сообщение - не ленитесь пользоваться кнопкой СПАСИБО.
Если вам помогло какое-либо мое сообщение - не ленитесь пользоваться кнопкой СПАСИБО.
-
- Сообщения: 295
- Зарегистрирован: Вт апр 23, 2013 5:16 pm
- Откуда: Брянск
- Благодарил (а): 18 раз
- Поблагодарили: 94 раза
Re: Дизайн сцен 2
первое что в голову пришло) Создаем сценарий, который найдет все картинки в указанной директории, записывыем путь случайной картинки в свойство, запускаем этот сценарий каждые 5 минут из onNewMinute или модуль cron или таймаутом в этом же сценарии (SetTimeOut("ChangeSceneImage","runScript('ChangeSceneImage');", 300);). Картинку соответственно берем из свойства.
Пример, сценарий с именем ChangeSceneImage:
Пример, сценарий с именем ChangeSceneImage:
Код: Выделить всё
$directory = "./images"; // Папка с изображениями
$allowed_types = array("jpg", "png", "gif"); //разрешенные типы изображений
$file_parts = array();
$ext = "";
$i = 0;
$img_array = array();
//пробуем открыть папку
$dir_handle = @opendir($directory) or die("Ошибка при открытии папки !!!");
while ($file = readdir($dir_handle)) { //поиск по файлам
if ($file == "." || $file == "..")
continue; //пропустить ссылки на другие папки
$file_parts = explode(".", $file); //разделить имя файла и поместить его в массив
$ext = strtolower(array_pop($file_parts)); //последний элемент - это расширение
if (in_array($ext, $allowed_types)) {
$img_array[] = $directory . '/' . $file;
$i++;
}
}
closedir($dir_handle); //закрыть папку
sg('ThisComputer.ImageForScene', $img_array[rand(0, count($img_array))]);
- За это сообщение автора Dark_Veter поблагодарили (всего 2):
- adzam (Пт мар 03, 2017 8:51 pm) • wozowik (Чт фев 15, 2018 11:25 am)
- Рейтинг: 2.33%
Debian GNU/Linux 7.9 (wheezy), версия 0.9.0b, Connect
- adzam
- Сообщения: 602
- Зарегистрирован: Сб дек 08, 2012 10:28 pm
- Откуда: Кишинев
- Благодарил (а): 20 раз
- Поблагодарили: 138 раз
Re: Дизайн сцен 2
Большое спасибо , все заработало, это как раз что я и хотел.
Но эти меняющиеся картинки я хочу применить как фон на заглавной странице.
Но картинки на этой странице не хотят обновляться сами, только если обновляешь всю страницу вручную.
Может подскажите как заставить обновляться?
Файл default.html прилагаю.
Но эти меняющиеся картинки я хочу применить как фон на заглавной странице.
Но картинки на этой странице не хотят обновляться сами, только если обновляешь всю страницу вручную.
Может подскажите как заставить обновляться?
Файл default.html прилагаю.
СпойлерПоказать
<!--#
@version 0.2 (auto-set)
#-->
<script src="/templates_alt/jsgraphics/jsgraphics.js"></script>
<script src="/templates_alt/jsgraphics/state1.js"></script>
<style>
.ui-widget-content {
border: 1px solid transparent; /* рамка домашних страниц */
background: transparent; /* фон домашних страниц */
color: #333333;
}
::-webkit-scrollbar { /* убираем скроллы, общий справа*/
height:0px;
width: 0px;
scrolling:no;
}
.ui-tabs .ui-tabs-panel { /* увеличил рамку правого окна*/
padding:0em 0em;
}
</style>
<body scroll="no">
<script type="text/javascript" src="<#ROOTHTML#>js/ui.tabs.paging.js"></script>
<!-- Таблица -->
<table width="100%" border="0" style="background-image: url(%ThisComputer.ImageForScene%);position: fixed; overflow: hidden;">
<tr>
<td valign="top" colspan="4" width="100%">
<!-- шапка #1e5799 4%, #1e5799 14%,#B9D5EB 18%,-->
<div style="text-align: center; height:30; width:100%; overflow:hidden;background-repeat: no-repeat; background-image: url(/templates_alt/icon/lenta1275-31.png);position:relative; left: 0px; top:0px;">
<span style="cursor: default;position:relative; height:0; width:275;overflow:hidden;left:0px; top:6px;font-family: Arial, Helvetica, sans-serif; font-size:16px; text-align:center;color:#F9FC43;text-shadow: 1px 1px 2px black, 0 0 2em green">%Mainsity.metcast|300%</span>
</div>
</td>
</tr>
<tr>
<!-- вторая строка -->
<td width="8%" valign="center" >
<script language="javascript">
function leftPanelToggle() {
$('#leftPanel').toggle();
if ( $("#leftPanel").is(":visible") ) {
$("#leftPanelToggleIcon").attr("src","/templates_alt/icon/icon_left.png");
} else {
$("#leftPanelToggleIcon").attr("src","/templates_alt/icon/icon_right.png");
}
return false;
}
</script>
<a href="/"><img src="/templates_alt/icon/logo120-3a.gif" style=" position:relative; left:8px; top:0px"></a>
<a href="#" onClick="return leftPanelToggle();">
<img id="leftPanelToggleIcon" border="0" src="/templates_alt/icon/icon_left.png" border="0" style=" position: relative;left: 22px; top: -2px;"></a>
</td>
<!-- второй столбик -->
<td width="86%" colspan="2" valign="center" >
<style>
::-webkit-scrollbar { /* убираем скроллы, общий справа*/
height:0px;
width: 0px;
scrolling:no;
}
</style>
<div width="100%" height="100%" border="0" bgcolor="green" style="border-radius: 0.4em 0.4em 0.4em 0.4em;background:transparent">
<iframe src="/popup/scenes/3.html" width="100%" scrolling="no" height="100%" style="border-color: rgba(0, 0, 255, 0);height: 79px;margin: 10px;"></iframe>
</div>
</td>
<!-- третий столбик -->
<td width="18%" valign="center" >
<div style="background-repeat: no-repeat;background-image: url(/templates_alt/icon/bg31.png); position:relative; left: 10px; top:0px; height: 110;">
<div align="left" id="txt" style=' position:relative; left:0px; top:0px;cursor: default;text-align:center; text-shadow: 1px 1px 2px black, 0 0 1em green;font-size:5em;color:#F9FC43'>
</div>
<br>
<div id="txt1" style="font-family: Arial, Helvetica, sans-serif;text-shadow: 1px 1px 2px black, 0 0 2em green;position:relative; left:10px; top: -8px;cursor: default; text-align:center;color:#56d590;font-size:1.3em">
</div>
<div class="clock" style="position:relative; left: 9px; top:0px">
<ul class="cl">
<li class="ck" id="hours"></li>
<li class="ck" id="point">:</li>
<li class="ck" id="min"></li>
</ul>
<div id="Date"></div>
</div>
</div>
<style>
.container {width: 210px; margin: 0 auto; overflow: hidden;}
.clock {width:200px; padding:0px; border:0px solid #333; color:#F9FC43;text-shadow: 2px 2px 2px black }
#Date { font-family: Arial, Helvetica, sans-serif; font-size:15px; text-align:center;color:#56d590;;text-shadow: 2px 2px 2px black}
.cl { width:200px; margin:0 auto; padding:0px; list-style:none; text-align:center; }
.ck { display:inline; font-size:4.5em; text-align:center; font-family:Arial, Helvetica, sans-serif;text-shadow: 2px 2px 2px black }
#point { position:relative; -moz-animation:mymove 1s ease infinite; -webkit-animation:mymove 1s ease infinite; padding-left:10px; top:-5px; padding-right:10px; }
@-webkit-keyframes mymove
{
0% {opacity:1.0; border:0px solid #000;}
59% {opacity:0; text-shadow:none; }
100% {opacity:1.0; border:0px solid #000; }
}
@-moz-keyframes mymove
{
0% {opacity:1.0; border:1px solid #000;}
59% {opacity:0; text-shadow:none; }
100% {opacity:1.0; border:1px solid #000; }
}
</style>
<script type="text/javascript">
$(document).ready(function() {
// Создаем две переенные с названиями месяцев и дней недели в массиве
var monthNames = [ "января", "Февраля", "марта", "апреля", "мая", "июня", "июля", "августа", "Cентября", "октября", "ноября", "декабря" ];
var dayNames= ["Воскресенье","Понедельник","Вторник","Среда","Четверг","Пятница","Суббота"]
// Создаем объект newDate()
var newDate = new Date();
// Извлекаем текущую дату из объекта Date
newDate.setDate(newDate.getDate());
// Навыходе день, дата, месяц и год
$('#Date').html(dayNames[newDate.getDay()] + " " + newDate.getDate() + ' ' + monthNames[newDate.getMonth()]);
setInterval( function() {
// Создаем объект newDate() и извлекаем секунды текущего времени
var seconds = new Date().getSeconds();
// Добавляем начальный ноль к значению секунд
$("#sec").html(( seconds < 10 ? "0" : "" ) + seconds);
},1000);
setInterval( function() {
// Создаем объект newDate() и извлекаем минуты текущего времени
var minutes = new Date().getMinutes();
// Добавляем начальный ноль к значению минут
$("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
},1000);
setInterval( function() {
// Создаем объект newDate() и извлекаем часы из текущего времени
var hours = new Date().getHours();
// Добавляем начальный ноль к значению часов
$("#hours").html(( hours < 10 ? "0" : "" ) + hours);
}, 1000);
});
</script>
</div>
</td>
</tr>
<!-- третья строка-->
<tr>
<td width="8%" >
<div width="100%" style="text-align: center; height:30;overflow:hidden; background: url(/templates_alt/icon/lenta120x35.png) no-repeat;position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="8%">
<div style="text-align: center; height:30; width:100%; overflow:hidden;background-size: 100%; background-image: url(/templates_alt/icon/lenta120x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="64%">
<div style="text-align: center; height:30; width:100%; overflow:hidden; background-image: url(/templates_alt/icon/lenta820x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="16%">
<div style="text-align: center; height:30; width:100%; overflow:hidden; background-image: url(/templates_alt/icon/lenta230x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
</tr>
<!-- четвертая строка первый столбик -->
<tr>
<td valign="top" colspan="2" width="235" id="leftPanel">
<iframe src="<#ROOTHTML#>menu.html" width="235" height="459" id="navFrame" style="background: transparent" border="0" frameborder=0 framespacing=0></iframe>
</td>
<!-- четвертая строка второй столбик -->
<td valign="top" colspan="2" width="100%">
<Style> <!--# убираем меню с домашних страниц #-->
.ui-tabs .ui-tabs-nav {
display: none;
}
.ui-tabs .ui-tabs-panel {
padding: 0em 0em;
top: 7px;
position: relative;
}
</Style>
<div id="tabs">
<ul>
[#begin LAYOUTS#]
<li>
<a href="#tabs-[#ID#]"[#if ICON!=""#] style="padding:1px 1em 2px 0.5em"[#endif#]>[#if ICON!=""#]<img src="<#ROOTHTML#>cms/layouts/[#ICON#]" align="absmiddle" height="28"> [#endif#][#TITLE#]</a></li>
[#end LAYOUTS#]
<li>
<a href="#tabs-last"><span id='tablast_title'>***</span></a></li>
</ul>
[#begin LAYOUTS#]
<div id="tabs-[#ID#]">...</div>
[#end LAYOUTS#]
<div id="tabs-last">
...
</div>
</div>
</td>
</tr>
</table>
<script language="javascript">
var iFrameHeight=590;
$(document).ready(function() {
// Handler for .ready() called.
iFrameHeight=$(document).height()-110;
//alert($(document).height());
$('#navFrame').height(iFrameHeight+57);
[#begin LAYOUTS#]
$('#htmlTab[#NUM#]').height(iFrameHeight);
[#end LAYOUTS#]
//alert($('#defaultFrame').height());
});
[#begin LAYOUTS#]
var layoutTimer[#ID#];
[#end LAYOUTS#]
$("#tabs").tabs({
show: function(event, ui) {
iFrameHeight=$(document).height()-110;
var selected = $( "#tabs" ).tabs( "option", "selected" );
//alert(selected);
[#begin LAYOUTS#]
if (selected == [#NUM#]) {
clearTimeout(layoutTimer[#ID#]);
[#if TYPE="app"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="<#ROOTHTML#>popup/[#APP#].html" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
[#if TYPE="url"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="[#URL#]" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
[#if TYPE="html"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="<#ROOTHTML#>page/[#ID#].html" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
} else {
if ($('#tabs-[#ID#]').html()!='...') {
clearTimeout(layoutTimer[#ID#]);
layoutTimer[#ID#]=setTimeout("$('#tabs-[#ID#]').html('...');", 59*1000);
}
}
[#end LAYOUTS#]
}});
$('#tabs').tabs('paging', {cycle:false, follow:false});
</script>
</body>
@version 0.2 (auto-set)
#-->
<script src="/templates_alt/jsgraphics/jsgraphics.js"></script>
<script src="/templates_alt/jsgraphics/state1.js"></script>
<style>
.ui-widget-content {
border: 1px solid transparent; /* рамка домашних страниц */
background: transparent; /* фон домашних страниц */
color: #333333;
}
::-webkit-scrollbar { /* убираем скроллы, общий справа*/
height:0px;
width: 0px;
scrolling:no;
}
.ui-tabs .ui-tabs-panel { /* увеличил рамку правого окна*/
padding:0em 0em;
}
</style>
<body scroll="no">
<script type="text/javascript" src="<#ROOTHTML#>js/ui.tabs.paging.js"></script>
<!-- Таблица -->
<table width="100%" border="0" style="background-image: url(%ThisComputer.ImageForScene%);position: fixed; overflow: hidden;">
<tr>
<td valign="top" colspan="4" width="100%">
<!-- шапка #1e5799 4%, #1e5799 14%,#B9D5EB 18%,-->
<div style="text-align: center; height:30; width:100%; overflow:hidden;background-repeat: no-repeat; background-image: url(/templates_alt/icon/lenta1275-31.png);position:relative; left: 0px; top:0px;">
<span style="cursor: default;position:relative; height:0; width:275;overflow:hidden;left:0px; top:6px;font-family: Arial, Helvetica, sans-serif; font-size:16px; text-align:center;color:#F9FC43;text-shadow: 1px 1px 2px black, 0 0 2em green">%Mainsity.metcast|300%</span>
</div>
</td>
</tr>
<tr>
<!-- вторая строка -->
<td width="8%" valign="center" >
<script language="javascript">
function leftPanelToggle() {
$('#leftPanel').toggle();
if ( $("#leftPanel").is(":visible") ) {
$("#leftPanelToggleIcon").attr("src","/templates_alt/icon/icon_left.png");
} else {
$("#leftPanelToggleIcon").attr("src","/templates_alt/icon/icon_right.png");
}
return false;
}
</script>
<a href="/"><img src="/templates_alt/icon/logo120-3a.gif" style=" position:relative; left:8px; top:0px"></a>
<a href="#" onClick="return leftPanelToggle();">
<img id="leftPanelToggleIcon" border="0" src="/templates_alt/icon/icon_left.png" border="0" style=" position: relative;left: 22px; top: -2px;"></a>
</td>
<!-- второй столбик -->
<td width="86%" colspan="2" valign="center" >
<style>
::-webkit-scrollbar { /* убираем скроллы, общий справа*/
height:0px;
width: 0px;
scrolling:no;
}
</style>
<div width="100%" height="100%" border="0" bgcolor="green" style="border-radius: 0.4em 0.4em 0.4em 0.4em;background:transparent">
<iframe src="/popup/scenes/3.html" width="100%" scrolling="no" height="100%" style="border-color: rgba(0, 0, 255, 0);height: 79px;margin: 10px;"></iframe>
</div>
</td>
<!-- третий столбик -->
<td width="18%" valign="center" >
<div style="background-repeat: no-repeat;background-image: url(/templates_alt/icon/bg31.png); position:relative; left: 10px; top:0px; height: 110;">
<div align="left" id="txt" style=' position:relative; left:0px; top:0px;cursor: default;text-align:center; text-shadow: 1px 1px 2px black, 0 0 1em green;font-size:5em;color:#F9FC43'>
</div>
<br>
<div id="txt1" style="font-family: Arial, Helvetica, sans-serif;text-shadow: 1px 1px 2px black, 0 0 2em green;position:relative; left:10px; top: -8px;cursor: default; text-align:center;color:#56d590;font-size:1.3em">
</div>
<div class="clock" style="position:relative; left: 9px; top:0px">
<ul class="cl">
<li class="ck" id="hours"></li>
<li class="ck" id="point">:</li>
<li class="ck" id="min"></li>
</ul>
<div id="Date"></div>
</div>
</div>
<style>
.container {width: 210px; margin: 0 auto; overflow: hidden;}
.clock {width:200px; padding:0px; border:0px solid #333; color:#F9FC43;text-shadow: 2px 2px 2px black }
#Date { font-family: Arial, Helvetica, sans-serif; font-size:15px; text-align:center;color:#56d590;;text-shadow: 2px 2px 2px black}
.cl { width:200px; margin:0 auto; padding:0px; list-style:none; text-align:center; }
.ck { display:inline; font-size:4.5em; text-align:center; font-family:Arial, Helvetica, sans-serif;text-shadow: 2px 2px 2px black }
#point { position:relative; -moz-animation:mymove 1s ease infinite; -webkit-animation:mymove 1s ease infinite; padding-left:10px; top:-5px; padding-right:10px; }
@-webkit-keyframes mymove
{
0% {opacity:1.0; border:0px solid #000;}
59% {opacity:0; text-shadow:none; }
100% {opacity:1.0; border:0px solid #000; }
}
@-moz-keyframes mymove
{
0% {opacity:1.0; border:1px solid #000;}
59% {opacity:0; text-shadow:none; }
100% {opacity:1.0; border:1px solid #000; }
}
</style>
<script type="text/javascript">
$(document).ready(function() {
// Создаем две переенные с названиями месяцев и дней недели в массиве
var monthNames = [ "января", "Февраля", "марта", "апреля", "мая", "июня", "июля", "августа", "Cентября", "октября", "ноября", "декабря" ];
var dayNames= ["Воскресенье","Понедельник","Вторник","Среда","Четверг","Пятница","Суббота"]
// Создаем объект newDate()
var newDate = new Date();
// Извлекаем текущую дату из объекта Date
newDate.setDate(newDate.getDate());
// Навыходе день, дата, месяц и год
$('#Date').html(dayNames[newDate.getDay()] + " " + newDate.getDate() + ' ' + monthNames[newDate.getMonth()]);
setInterval( function() {
// Создаем объект newDate() и извлекаем секунды текущего времени
var seconds = new Date().getSeconds();
// Добавляем начальный ноль к значению секунд
$("#sec").html(( seconds < 10 ? "0" : "" ) + seconds);
},1000);
setInterval( function() {
// Создаем объект newDate() и извлекаем минуты текущего времени
var minutes = new Date().getMinutes();
// Добавляем начальный ноль к значению минут
$("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
},1000);
setInterval( function() {
// Создаем объект newDate() и извлекаем часы из текущего времени
var hours = new Date().getHours();
// Добавляем начальный ноль к значению часов
$("#hours").html(( hours < 10 ? "0" : "" ) + hours);
}, 1000);
});
</script>
</div>
</td>
</tr>
<!-- третья строка-->
<tr>
<td width="8%" >
<div width="100%" style="text-align: center; height:30;overflow:hidden; background: url(/templates_alt/icon/lenta120x35.png) no-repeat;position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="8%">
<div style="text-align: center; height:30; width:100%; overflow:hidden;background-size: 100%; background-image: url(/templates_alt/icon/lenta120x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="64%">
<div style="text-align: center; height:30; width:100%; overflow:hidden; background-image: url(/templates_alt/icon/lenta820x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
<td width="16%">
<div style="text-align: center; height:30; width:100%; overflow:hidden; background-image: url(/templates_alt/icon/lenta230x35.png);position:relative; left: 0px; top:0px;">
</div>
</td>
</tr>
<!-- четвертая строка первый столбик -->
<tr>
<td valign="top" colspan="2" width="235" id="leftPanel">
<iframe src="<#ROOTHTML#>menu.html" width="235" height="459" id="navFrame" style="background: transparent" border="0" frameborder=0 framespacing=0></iframe>
</td>
<!-- четвертая строка второй столбик -->
<td valign="top" colspan="2" width="100%">
<Style> <!--# убираем меню с домашних страниц #-->
.ui-tabs .ui-tabs-nav {
display: none;
}
.ui-tabs .ui-tabs-panel {
padding: 0em 0em;
top: 7px;
position: relative;
}
</Style>
<div id="tabs">
<ul>
[#begin LAYOUTS#]
<li>
<a href="#tabs-[#ID#]"[#if ICON!=""#] style="padding:1px 1em 2px 0.5em"[#endif#]>[#if ICON!=""#]<img src="<#ROOTHTML#>cms/layouts/[#ICON#]" align="absmiddle" height="28"> [#endif#][#TITLE#]</a></li>
[#end LAYOUTS#]
<li>
<a href="#tabs-last"><span id='tablast_title'>***</span></a></li>
</ul>
[#begin LAYOUTS#]
<div id="tabs-[#ID#]">...</div>
[#end LAYOUTS#]
<div id="tabs-last">
...
</div>
</div>
</td>
</tr>
</table>
<script language="javascript">
var iFrameHeight=590;
$(document).ready(function() {
// Handler for .ready() called.
iFrameHeight=$(document).height()-110;
//alert($(document).height());
$('#navFrame').height(iFrameHeight+57);
[#begin LAYOUTS#]
$('#htmlTab[#NUM#]').height(iFrameHeight);
[#end LAYOUTS#]
//alert($('#defaultFrame').height());
});
[#begin LAYOUTS#]
var layoutTimer[#ID#];
[#end LAYOUTS#]
$("#tabs").tabs({
show: function(event, ui) {
iFrameHeight=$(document).height()-110;
var selected = $( "#tabs" ).tabs( "option", "selected" );
//alert(selected);
[#begin LAYOUTS#]
if (selected == [#NUM#]) {
clearTimeout(layoutTimer[#ID#]);
[#if TYPE="app"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="<#ROOTHTML#>popup/[#APP#].html" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
[#if TYPE="url"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="[#URL#]" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
[#if TYPE="html"#]
if ($('#tabs-[#ID#]').html()=='...') {
$('#tabs-[#ID#]').html('<iframe src="<#ROOTHTML#>page/[#ID#].html" width=100% height="'+iFrameHeight+'" border="0" frameborder="0"></iframe>');
}
[#endif TYPE#]
} else {
if ($('#tabs-[#ID#]').html()!='...') {
clearTimeout(layoutTimer[#ID#]);
layoutTimer[#ID#]=setTimeout("$('#tabs-[#ID#]').html('...');", 59*1000);
}
}
[#end LAYOUTS#]
}});
$('#tabs').tabs('paging', {cycle:false, follow:false});
</script>
</body>
Последний раз редактировалось adzam Вс мар 12, 2017 9:08 am, всего редактировалось 3 раза.
Мои проекты здесь...https://connect.smartliving.ru/profile/41/blog213.htm
Если вам помогло какое-либо мое сообщение - не ленитесь пользоваться кнопкой СПАСИБО.
Если вам помогло какое-либо мое сообщение - не ленитесь пользоваться кнопкой СПАСИБО.
- adzam
- Сообщения: 602
- Зарегистрирован: Сб дек 08, 2012 10:28 pm
- Откуда: Кишинев
- Благодарил (а): 20 раз
- Поблагодарили: 138 раз
Re: Дизайн сцен 2
Нужна помощь.
У меня есть три html сцены :
info-1
info-2
info-3
Как можно запустить их, чтоб они переключались по кольцу каждые 5 минут.
В настройках ничего не нашел.
Может скриптом каким-либо.
В меню есть Задержка при ротации:, а в сценах ничего не нашел.
Помогите пож.
У меня есть три html сцены :
info-1
info-2
info-3
Как можно запустить их, чтоб они переключались по кольцу каждые 5 минут.
В настройках ничего не нашел.
Может скриптом каким-либо.
В меню есть Задержка при ротации:, а в сценах ничего не нашел.
Помогите пож.
Мои проекты здесь...https://connect.smartliving.ru/profile/41/blog213.htm
Если вам помогло какое-либо мое сообщение - не ленитесь пользоваться кнопкой СПАСИБО.
Если вам помогло какое-либо мое сообщение - не ленитесь пользоваться кнопкой СПАСИБО.
- adzam
- Сообщения: 602
- Зарегистрирован: Сб дек 08, 2012 10:28 pm
- Откуда: Кишинев
- Благодарил (а): 20 раз
- Поблагодарили: 138 раз
Re: Дизайн сцен 2
Еще вопрос вот в элементах сцен есть такой пункт как Анимация появления,
Допустим если поставить в анимацию появления значение слева на право, то Сцена красиво заезжает с левой стороны.
А можно ли сделать , чтоб при смене сцен она так-же красиво уехала в право (допустим) уступая место новой сцене.
Иначе говоря как можно сделать анимацию исчезновения сцены.
Допустим если поставить в анимацию появления значение слева на право, то Сцена красиво заезжает с левой стороны.
А можно ли сделать , чтоб при смене сцен она так-же красиво уехала в право (допустим) уступая место новой сцене.
Иначе говоря как можно сделать анимацию исчезновения сцены.
Мои проекты здесь...https://connect.smartliving.ru/profile/41/blog213.htm
Если вам помогло какое-либо мое сообщение - не ленитесь пользоваться кнопкой СПАСИБО.
Если вам помогло какое-либо мое сообщение - не ленитесь пользоваться кнопкой СПАСИБО.
-
- Сообщения: 13
- Зарегистрирован: Ср ноя 02, 2016 11:05 am
- Откуда: Украина Днепр. обл
- Благодарил (а): 17 раз
- Поблагодарили: 1 раз
Re: Дизайн сцен 2
Подскажите пожалуйста как создать историю для ow_fact.temperature? нашел на фуруме и добавил
- Вложения
-
- Безымянный.png (190.69 КБ) 10240 просмотров
-
- Безымянный.png (257.55 КБ) 10240 просмотров