bonuswm.org - сервис раздачи бонусов webmoney

Приветствие в зависимости от времени суток

Приветствие в зависимости от времени суток

Добрый…. День, Вечер, Ночи, Утро

Если вы хотите разместить на своём сайте приветствие для посетителей, которое будет меняться автоматически в зависимости от времени суток, то сделать это очень просто. В нужном месте web-страницы, где вы хотите вывести приветствие, вставляете html код.

Простой html код

<script language="JavaScript"> day = new Date(); hour = day.getHours(); if (hour>=5 && hour<12) greeting = "Доброе утро"; else { if (hour>=12 && hour<18) greeting = "Добрый день"; else { if (hour>=18 && hour<24) greeting = "Добрый вечер"; else { if (hour>=0 && hour<5) greeting = "Доброй ночи"; } } } document.write(greeting); </script>

html код с картинкой

<center><img class="alignnone size-full wp-image-181" src="https://web-master-aleksej-zimin.ru/wp-content/uploads/2019/10/Лампочки.png" alt="" width="125" height="30" /></center><center><script language="JavaScript"> day = new Date(); hour = day.getHours(); if (hour>=5 && hour<12) greeting = "Доброе утро"; else { if (hour>=12 && hour<18) greeting = "Добрый день"; else { if (hour>=18 && hour<24) greeting = "Добрый вечер"; else { if (hour>=0 && hour<5) greeting = "Доброй ночи"; } } } document.write(greeting); </script></center>

И посетители Вашего сайта, в зависимости от времени суток, будут видеть следующую надпись:

Доброе утро с 5.00 часов до 12.00 часов

Добрый день с 12.00 часов до 18.00 часов

Добрый вечер с 18.00 часов до 24 часов

Доброй ночи с 24.00 часов до 5.00 часов

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

Как Вы понимаете в коде можно изменить текст приветствия, на любой другой, например написать Ура! Хорошее утро! вместо Доброе утро, и т.д. А также можно изменить время переключения надписей, исправив соответствующие цифровые значения.

Ну и конечно же используя стили CSS тексту приветствия, можно придать любой внешний вид, изменив шрифт, размер, цвет и т.д.


Приветствие + Сегодняшняя дата, день недели

Приветствие + Сегодняшняя дата, день недели. Это усовершенствованный вариант скрипта Приветствие по времени суток, который мы рассматривали ранее. В этом скрипте выводится еще день недели и текущая дата.

Вот так выглядит работа скрипта



html код
<div style="color:blue; font-size:10pt;" id="div1" name="div1"><script type="text/javascript">//<script type="text/javascript">// <![CDATA[
var h=(new Date()).getHours();
if (h > 22 || h < 6) document.write("Доброй ночи!");
if (h > 5 && h < 11) document.write("С добрым утром!");
if (h > 10 && h < 19) document.write("Добрый день!");
if (h > 18 && h < 23) document. write("Добрый вечер!");
// ]]></script>
<script type="text/javascript">// <![CDATA[
// center<![CDATA[
now = new Date()
if (now.getDay() == 0)
document.write("Завтра рабочий день... Сегодня ")
if (now.getDay() == 1)
document.write("Настраивайтесь на работу. Сегодня ")
if (now.getDay() == 2)
document.write("Сегодня ")
if (now.getDay() == 3)
document.write("Половина недели позади - Сегодня уже ")
if (now.getDay() == 4)
document.write("Сегодня ")
if (now.getDay() == 5)
document.write("Заканчивается неделя. Сегодня ")
if (now.getDay() == 6)
document.write("Сегодня ")
// далее
// ]]></script>
<script type="text/javascript">// <![CDATA[
var d = new Date();var day=new Array("Воскресенье","Понедельник","Вторник",
"Среда","Четверг","Пятница","Суббота");var month=new Array("января","февраля","марта","апреля","мая","июня",
"июля","августа","сентября","октября","ноября","декабря");document.write(day[d.getDay()]+" " +d.getDate()+ " " + month[d.getMonth()]
+ " " + d.getFullYear() + " г.");
// ]]></script> </div>

Просто скопируйте html код и вставьте в нужное место html кода Вашей web-страницы. В коде выводятся еще некоторые интересные надписи, например: Завтра рабочий деньПоловина недели позади и т.д. Конечно же если Вам не нравятся эти ремарки, Вы можете их отредактировать по своему усмотрению или убрать совсем.

В самой первой строке кода размещен стиль оформления внешнего вида:

style="color:blue; font-size:10pt;"

(color:blue) blue Это название цвета  (font-size:10pt) font-size10pt Это размер шрифта

Приветствие бегущая строка



html код
<marquee><div style="color:Maroon; font-size:16pt;" id="div1" name="div1"><script type="text/javascript">//<script type="text/javascript">// <![CDATA[
var h=(new Date()).getHours();
if (h > 22 || h < 6) document.write("Доброй ночи!");
if (h > 5 && h < 11) document.write("С добрым утром!");
if (h > 10 && h < 19) document.write("Добрый день!");
if (h > 18 && h < 23) document. write("Добрый вечер!");
// ]]></script>
<script type="text/javascript">// <![CDATA[
// center<![CDATA[
now = new Date()
if (now.getDay() == 0)
document.write("Завтра рабочий день... Сегодня ")
if (now.getDay() == 1)
document.write("Настраивайтесь на работу. Сегодня ")
if (now.getDay() == 2)
document.write("Сегодня ")
if (now.getDay() == 3)
document.write("Половина недели позади - Сегодня уже ")
if (now.getDay() == 4)
document.write("Сегодня ")
if (now.getDay() == 5)
document.write("Заканчивается неделя. Сегодня ")
if (now.getDay() == 6)
document.write("Сегодня ")
// далее
// ]]></script>
<script type="text/javascript">// <![CDATA[
var d = new Date();var day=new Array("Воскресенье","Понедельник","Вторник",
"Среда","Четверг","Пятница","Суббота");var month=new Array("января","февраля","марта","апреля","мая","июня",
"июля","августа","сентября","октября","ноября","декабря");document.write(day[d.getDay()]+" " +d.getDate()+ " " + month[d.getMonth()]
+ " " + d.getFullYear() + " г.");
// ]]></script></div></marquee>

Как вы понимаете здесь можно изменить цвет и размер шрифта, подогнав под дизайн своего сайта или конкретной web-страницы, или наоборот сделав отличным от общего дизайна сайта.

Для тестирование html кодов создайте простую html страницу с помощью блокнота Windows

Автор

admin

Комментарии:

Добавить комментарий

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.