Смена картинок по заданному времени

Смена картинок по заданному времени

Здравствуйте дорогие друзья. Хочу представить вашему вниманию информацию как сделать смену картинок в определенно заданное вами время. Например: Утром картинка восходящего солнца, в обед она заменяется на солнце в зените, вечером на закат, а ночью заменяется на луну. А что б сделать смену картинок, нам понадобится небольшой скрипт, в котором и задается время и на что заменить картинку. Так как я сам не сильно разбираюсь в скриптах на java, то мне в этом помогли, а я в свою очередь хочу поделится с вами этим скриптом.

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

Второе что нужно сделать это определить временные рамки смены картинок. Например: с 7.00 — 12.00 одна картинка, 12.00-20.00 другая и 20.00-24.00 + 0.00 — 7.00 третья. Замете как я указал время для третьей картинки, данное условие должно точно соблюдаться.

Смена картинок по заданному времени

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

<script type="text/javascript" language="Javascript">//<![CDATA[
document.write('<span id="Img"></span>')

day = new Date(); hour = day.getHours();
if (hour>=7 && hour<12) {document.getElementById(«Img»).innerHTML ='<img src=»http://site.ru/utro.gif» alt=»» />’;  }

else if (hour>=12 && hour<19)
{document.getElementById(«Img»).innerHTML ='<img src=»http://site.ru/den.gif" alt="" />'; }

else if (hour>=19 && hour<24)
{document.getElementById(«Img»).innerHTML ='<img src=»http://site.ru/ve4er.gif" alt="" />';  }

else  if (hour>=0 && hour<7)
{document.getElementById(«greetingImg»).innerHTML ='<img src=»http://site.ru/no4.gif" alt="" />'; }  ;

//]]></script>

Вот и все. Как вы видите красным я выделил вывод изображения и адрес к картинкам что будут заменятся. Если вам нужно кроме смены картинки заменить вместе с ней еще и кусочек кода, тогда смело вписывайте  его к пути изображения и помните никаких пробелов не должно быть в коде, а если хотите разделить все таки, тогда ставите символ пробела &nbsp;.

В нашей стране привыкли, что музыканты на празднике обязательно должны присутствовать. Ведь без музыки совсем скучно. Не так ли?

На этом пост Смена картинок по заданному времени заканчиваю. До новых встреч и спасибо за внимание.

Яcreated’s blog

Получать обновления ЯcReated’s blog:

Смена картинок по заданному времени: 8 комментариев

  1. Дорогие друзья блогеры!
    Поздравляю Вас с Новым 2011 Годом и Рождеством!

    От всей души поздравляю Вас с Новым 2011 годом! Пусть наступающий год щедро одарит вас удачей, здоровьем, тысячами позитивных эмоций, принесет в дом мир и любовь.

  2. Поздравляю вас Старо-Новым годом, желаю вам в новом году успехов и спасибо что вы находите время поддерживать ваш замечательный блог!

  3. Здравствуйте. Объясните пожалуйста как монтировать данный скрипт в Joomla 1.5?

      • А в какой модуль? , допустим я хочу сделать смену картинок в Header…

        • В менеджере модулей создаешь модуль «Собственный HTML» и в этот модуль вставляешь скрипт. А позицию этого модуля прописываешь в шапке.

Обсуждение закрыто.