Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Корзина » Вопрос по скрипту "Изменение цвета фона в течение суток"


Вопрос по скрипту "Изменение цвета фона в течение суток"

Сообщений 1 страница 20 из 26

1

Здраствуйте, уважаемые администраторы!
У меня возник вопрос по поводу одного скрипта.
Идея такова, я создал дизайн, но я хочу чтобы шапка, можно еще и фон, форума менялась в соответствии с сутками, иными словами день/ночь. Допустим с 9 утра - одна картинка, с 9 вечера - другая картинка.

Вот сам HTML - код:
Изменение цвета фона в течение суток

Код:
<html>
<head>
<title>Изменение цвета фона в течение суток</title>
<script language="JavaScript"> 
<!--
theTime = new Date(); 
theHour = theTime.getHours(); 
if(theHour>6&&theHour<18){ 
document.write('<body bgcolor="#990066" text="white">'); 
} 
else{ 
document.write('<body bgcolor="#003399" text="white">'); 
} 
-->
</script> 
</head>
<body link="#8000ff" alink="#dc5912" vlink="#9b4e00">
<iframe src="menu.htm" align="left" width="140" height="560" scrolling="no" frameborder="0"></iframe>
#990066 - фон, который показывается днем.
#003399- фон, который показывается ночью. 
</body>
</html>

Здесь, конечно, понятно, что это для отдельной web-страницы.
Вопрос, можно ли что-нибудь подобное сотворить на форуме с определенной структурой:
Ссылка на форум

Отредактировано Ночной призрак (Вт, 24 Апр 2012 22:30:29)

0

2

Ночной призрак
Поставьте в начало HTML верх

<script language="JavaScript">
<!--
theTime = new Date();
theHour = theTime.getHours();
if(theHour>6&&theHour<18){
document.write('<style>body{background-color:#990066;}</style>');
}
else{
document.write('<style>body{background-color:#003399;}</style>');
}
-->
</script>

Время для теста мон менять на компе=> http://uploads.ru/t/o/j/x/ojxGv.png

Поправил

Отредактировано Deff (Вт, 24 Апр 2012 23:19:36)

+1

3

Deff
Ок, поставил, время стоит от 9 до 11. Завтра доложу результаты.
Благодарю за помощь!

Отредактировано Ночной призрак (Вт, 24 Апр 2012 23:20:10)

0

4

Ночной призрак
Там еще раз поправил

0

5

Deff написал(а):

Там еще раз поправил

Переставил

0

6

Ночной призрак
НУ??? меняет?? прикольно??
и себе захотелось.... :D

0

7

Хмм, что-то действия не наблюдаю, сейчас у меня стоит:

Код:
<script language="JavaScript"> 
<!--
theTime = new Date(); 
theHour = theTime.getHours(); 
if(theHour>10&&theHour<11){ 
document.write('<style>body{background-color:#990066;}</style>'); 
} 
else{ 
document.write('<style>body{background-color:#003399;}</style>'); 
} 
-->
</script>

Результаты:
8.39
10.28

Возможно, в скрипте не хватает "Then"? Т.к. этот скрипт работает по принципу "Если, то, иначе"
Попробую сделать так:

Код:
<script language="JavaScript"> 
<!--
theTime = new Date(); 
theHour = theTime.getHours(); 
if(theHour>11&&theHour<12)
Then{ 
document.write('<style>body{background-color:#990066;}</style>'); 
} 
else{ 
document.write('<style>body{background-color:#003399;}</style>'); 
} 
-->
</script>

Да, после того, как я его поставил вон изменился на "003399" т.е. синий. Был черный.
Можно, чтоб еще и шапка менялась?

В Структуре style.css за шапку и фон отвечает:

Код:
/* A2 Deal with browser defaults and wonkiness
-------------------------------------------------------------*/

html, body {margin: 0; padding: 0; background: no-repeat #000000 url("http://s018.radikal.ru/i517/1202/c1/91a944b57db5.jpg") scroll top center;}

0

8

Ночной призрак написал(а):

Хмм, что-то действия не наблюдаю, сейчас у меня стоит:

Мну же сказал как можно быстро проверить - вызываете часы из трея(в левом нижнем углу и переводите время туда -сюда - (у меня работает ) правдо смены ток две ток с 6 до 18 и с 18 до 6 утра

'Then' - нет в ява скрипт

0

9

О, все отлично работает.  :idea:
Стоит в HTML верх:

Код:
<script language="JavaScript"> 
<!--
theTime = new Date(); 
theHour = theTime.getHours(); 
if(theHour>6&&theHour<18){ 
document.write('<style>body{background-color:#990066;}</style>'); 
} 
else{ 
document.write('<style>body{background-color:#003399;}</style>'); 
} 
-->
</script>

Меняет фон в 7.00 и в 18.00

Я еще пошаманил над скриптом, теперь меняется не только фон, но и шапка:  :idea:
Вот это даааа!  :D

Код:
<script language="JavaScript"> 
<!--
theTime = new Date(); 
theHour = theTime.getHours(); 
if(theHour>6&&theHour<18){ 
document.write('<style>body{margin: 0; padding: 0; background: no-repeat #000000 url("Ссылка на картинку") scroll top center;}</style>'); 
} 
else{ 
document.write('<style>body{margin: 0; padding: 0; background: no-repeat #ffffff url("Ссылка на картинку") scroll top center;}</style>'); 
} 
-->
</script>

#000000 - цвет фона
url("Ссылка на картинку") - шапка
:cool:

Deff
Благодарю вас за подсказку!

Отредактировано Ночной призрак (Ср, 25 Апр 2012 12:55:58)

0

10

Ночной призрак
в принципе - мон бы плавно  менять градиенты к примеру по часу - ток нужен массив цветов

0

11

Deff написал(а):

в принципе - мон бы плавно  менять градиенты к примеру по часу - ток нужен массив цветов

Хмм, интересно. Но чтоб это реализовать, я могу предположить, что скрипт нужно отредачить примерно так:

Код:
<script language="JavaScript"> 
<!--
theTime = new Date(); 
theHour = theTime.getHours(); 
if(theHour>1&&theHour<2){ 
document.write('<style>body{margin: 0; padding: 0; background: no-repeat #000000 url("Ссылка на картинку") scroll top center;}</style>'); 
} 
if(theHour>2&&theHour<3){ 
document.write('<style>body{margin: 0; padding: 0; background: no-repeat #000000 url("Ссылка на картинку") scroll top center;}</style>'); 

...

if(theHour>23&&theHour<0){ 
document.write('<style>body{margin: 0; padding: 0; background: no-repeat #000000 url("Ссылка на картинку") scroll top center;}</style>');
if(theHour>0&&theHour<1){ 
document.write('<style>body{margin: 0; padding: 0; background: no-repeat #000000 url("Ссылка на картинку") scroll top center;}</style>'); 
-->
</script>

И вот так на сутки настроить. Так оно будет работать или это полный бред? х)
Я пока с явой так, не много разбираюсь. Но что-то не много похоже с системой программирования Паскаль. х)

0

12

Ночной призрак
ИМХО, для этого лучше использовать массив? Что-нибудь типа такого.

var urls = new Array();
urls[0] = 'Картинка с 0 до 1 часа';
urls[1] = 'Картинка с 1 до 2 часов';
urls[2] = 'Картинка с 2 до 3 часов';
. . .
urls[22] = 'Картинка с 22 до 23 часов';
urls[23] = 'Картинка с 23 до 0 часов';

theTime = new Date();
document.write('<style>body{margin: 0; padding: 0; background: no-repeat #000000 url("'+urls[math.floor(theTime.getHours())]+'") scroll top center;}</style>');

Должно сработать. И это будет короче твоего кода.

0

13

kozhilya
Хм, можно и так. Но вот только один вопрос:
urls[0] - это же номер элемента массива, ведь так?
Не факт, что будет через каждый час менять...

Отредактировано Ночной призрак (Ср, 25 Апр 2012 21:58:40)

0

14

Ночной призрак написал(а):

urls[0] - это же номер элемента массива, ведь так?

Да.

Ночной призрак написал(а):

Не факт, что будет через каждый час менять...

Ну... Почему же? Я беру urls[math.floor(theTime.getHours())], math.floor - отбрасывание дробной часть десятичного числа, theTime.getHours() - это из твоего кода. Так что если твой код работал, то и этот сработает. Ну, если только с регистром слова Math не напутал...

0

15

kozhilya написал(а):

Ну... Почему же? Я беру urls[math.floor(theTime.getHours())], math.floor - отбрасывание дробной часть десятичного числа, theTime.getHours() - это из твоего кода. Так что если твой код работал, то и этот сработает. Ну, если только с регистром слова Math не напутал...

Хем))
Я конечно в этом не спец. Ну чтож, попробовать можно всегда! ;)

0

16

Ночной призрак написал(а):

Я конечно в этом не спец. Ну чтож, попробовать можно всегда!

Даже если я напутал с функциями, то будет у тебя сдвиг на 1 час и отсутствие изображения с 23 до 0 часов.

Вот. А градиент, который Deff хочет сделать через массив цветов, возможно сделать на js... Я делал подобное на C#, но это платформенный язык... И выбрать математическую функцию для изменения цвета. Можно использовать math.sin(hour/2*15)... Ну, это в градусах... А перевод числа в hex-систему - стандартная функция. Тогда вообще можно сделать ежесекундый градиент :)

0

17

Здравствуйте, уважаемые!
Вопрос - просьба практически в тему:
Вот форум: http://kamdogs.funbb.ru/ (если не откроется, то через ГУГЛ "КАМЧАТКА КИНОЛОГИЧЕСКАЯ")
У меня есть картинка, которую я хочу поставить фоном форума, картинка в двух вариантах день и ночь.
Напишите, пожалуйста скриптик, чтобы эти картинки сменялись через каждые 12 часов, день - с 8.00 до 20.00, ночь, соответственно - с 20.00 до 8.00.
Вот ссылки на картинки:
день: http://s019.radikal.ru/i619/1204/05/420ff6c4bc24.gif
ночь: http://s44.radikal.ru/i105/1204/9a/6b06fdf59cb4.gif

Ну ооочень хочется!!!  http://mybb.ru/f/collection/0211.gif
Заранее благодарна!!!  http://mybb.ru/f/collection/0230.gif  http://mybb.ru/f/collection/0211.gif

0

18

Kinolog
В начало HTML верх
На твоей структуре думаю такой будет работать:

Код:
<script language="JavaScript"> 
<!--
theTime = new Date(); 
theHour = theTime.getHours(); 
if(theHour>7&&theHour<20){ 
document.write('<style>body{background-image: url("http://s019.radikal.ru/i619/1204/05/420ff6c4bc24.gif");}</style>'); 
} 
else{ 
document.write('<style>body{background-image: url("http://s44.radikal.ru/i105/1204/9a/6b06fdf59cb4.gif");}</style>'); 
} 
-->
</script>

Пробуй! ;)

Отредактировано Ночной призрак (Чт, 26 Апр 2012 07:51:47)

0

19

Значит, проблема такая:
рисунок встал, по времени не знаю, надо проверять в разное время, но вроде нормально ставила вечером - картинка ночная. НО! Картинка встала почему-то маленькая и размножилась, а мне нужна одна и на весь экран!!!Сможете исправить?
Раньше (и сейчас пока назад поставлю) вот это было (есть):

<style type="text/css"> /*Фоновый рисунок*/
html, body {
background: transparent none !important;
}
</style>
<img src="http://s019.radikal.ru/i619/1204/05/420ff6c4bc24.gif" style="position: fixed; top: 0; left: 0; z-index: -1; width: 100%; height: 100% ; margin: 0 0 0 0;"/>

0

20

Проблема осталась.

0


Вы здесь » Единый форум поддержки » Корзина » Вопрос по скрипту "Изменение цвета фона в течение суток"