Отправляет email-рассылки с помощью сервиса Sendsay

Программирование на JavaScript

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Заметки Дизайнера" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Сентябрь 2005   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
Автор
ImHoster.net

Статистика

0 подписчиков
-4 за неделю
←   Все выпуски   →

Программирование на JavaScript Выпуск No 36


Информационный Канал Subscribe.Ru

Программирование на JavaScript
Выпуск      : 36
Подписчиков : 13789
Cайт        : SoftMaker.com.ru
Архив       : Программирование на JavaScript (архив)
В этом выпуске
DHTML и CSS для Internet

DHTML и CSS для Internet

От автора

Здравствуйте уважаемые подписчики !

Как всегда, рад приветствовать вас на страницах этой рассылки.

Как обычно, напомню, что если Вы хотите:

  • - опубликовать здесь скрипт или статью
  • - создать и вести какой либо раздел в этой рассылке
  • - поучаствовать в формировании ее содержимого
просто напишите мне.

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

И, как всегда, вы можете задать свои вопросы по JavaScript - программированию на форуме. Или обсудить их в дискуссионном листе "Скрипты для сайта".

С уважением, Вахтуров Виктор.

P.S. Лето закончилось, и теперь рассылка возобновляет регулярный выход. В новом сезоне я постараюсь сделать материал рассылки еще более интересным и полезным. Надеюсь, каждый найдет здесь что то для себя.

Java Script solutions

Так как данный выпуск - первый в новом сезоне (для многих лето еще не кончилось :) ), то его объем невелик. Сегодня здесь будет рассмотрен один скрипт. Он достаточно прост, но может оказаться весьма полезным.

Этот скрипт выводит текущее время и дату. Формат вывода легко задается в скрипте. Есть возможность вывода названия месяца, названия дня недели и сокращенного названия дня недели. Также скрипт проигрывает музыкальный файл в конце каждого часа (можно, например, использовать звон настоящих часов, либо голос кукушки).

Автор скрипта: Шумов Егор (pixmaster at ukr.net).

Скрипт использовался автором в основном для вывода времени на рабочем столе (включенный Active Desktop). И действительно, попробуйте сами - неплохо смотрится.

Скрипт отображения текущего времени в заданном формате.

Скрипт нормально работает в Internet Explorer (используется тег bgsound для воспроизведения звука и атрибуты innerHTML для изменения текста на странице). Однако его просто доработать и для других браузеров (если захотите использовать его не только на рабочем столе, но и, например, на сайте).

Ниже привожу код скрипта, в html-документе. Достаточно скопировать полностью содержимое нижеприведенного блока в файл чтобы попробовать скрипт в работе.

<html>
<head>

<!--
Автор: Шумов Егор, pixmaster at ukr.net
-->

 <title>New</title>
<style type="text/css">

#time_area {
        font-size:64;
        color:#54C4F3;
        font-family: "Comic Sans MS";
        font-weight: bold;
}
#day_area {
        font-size:48;
        color:#D3F2FF;
        font-family: cursive;
        font-weight: normal;
}
#date_area {
        font-size:48;
        color:#54C4F3;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: normal;
}
 .symbols {
        font-family: Wingdings;
        font-size: 48px;
        color: #FFFFFF;
}
</style>
<meta http-equiv="Content-Type" content="text/html;
 charset=windows-1251"></head>

<body bgcolor="#3A6EA5">

<bgsound src="" loop="1" id="sound">
<div style=""vertical-align:bottom;" xposition:absolute;
 top:330px; left:10px">
<div id="time_area"></div>
<div id="day_area" ></div>
<div id="date_area"></div>
</div>

<script language="JavaScript">

/*
%YYYY% - год
%MM%   - полное название месяца
%M%    - сокращенное название месяца
%D%    - число месяца

%dddd% - полное название дня недели
%dd%   - сокращенное название дня недели
%d%    - номер дня недели

%h%    - часы
%m%    - минуты
%s%    - секунды

*/
Begin_Flag  = true;
ShowSeconds = false;
TimeOut     = 1000;

if (ShowSeconds)
 {
  TimeFormatStr = "%h% %m% %s%";
 }
else
 {
  TimeFormatStr = "%h% %m% %s%";
 }

DayFormatStr  = "%dddd%";
DateFormatStr = "%D% %MM% %YYYY% года";

function DateStr(TimeStamp)
 {
  now  = new Date();
  Hour = now.getHours();
  Min  = now.getMinutes();
  Sec  = now.getSeconds();

  FullMonthName  = new Array("января","февраля","марта",
                             "апреля","мая","июня",
                             "июля","августа","сентября",
                             "октября","ноября","декабря");
  ShortMonthName = new Array("янв","фев","мар","апр",
                             "май","июн","июл","авг",
                             "сен","окт","ноя","дек");
  FullDayName  = new Array("воскресенье","понедельник",
                           "вторник","среда","четверг",
                           "пятница","суббота");
  ShortDayName = new Array("вс","пн","вт","ср",
                           "чт","пт","сб");


  TimeStamp = TimeStamp.replace(/%YYYY%/,now.getYear());
  TimeStamp = TimeStamp.replace(/%MM%/,
                                FullMonthName[now.getMonth()]);
  TimeStamp = TimeStamp.replace(/%M%/,
                                ShortMonthName[now.getMonth()]);
  TimeStamp = TimeStamp.replace(/%D%/,
                                now.getDate());

  TimeStamp = TimeStamp.replace(/%dddd%/,
                                FullDayName[now.getDay()]);
  TimeStamp = TimeStamp.replace(/%dd%/,
                                ShortDayName[now.getDay()]);
  TimeStamp = TimeStamp.replace(/%d%/,now.getDay());

  TimeStamp = TimeStamp.replace(/%h%/,Hour);
  TimeStamp = TimeStamp.replace(/%m%/,((Min < 10) ? "0" :
                                                    "") + Min);
  TimeStamp = TimeStamp.replace(/%s%/,((Sec < 10) ? "0" :
                                                    "") + Sec);

  return TimeStamp;
 }

function WriteTime()
 {
  document.getElementById("time_area").innerHTML =
                                       DateStr(TimeFormatStr);

  now  = new Date();
  Hour = now.getHours();
  Min  = now.getMinutes();
  Sec  = now.getSeconds();

  if (!ShowSeconds && Sec == 0)
   {
    TimeOut     = 60000;
    ShowSeconds = true;
   }

  if (((Hour == 0) && (Min == 0) && (Sec == 1)) || (Begin_Flag))
   {
    document.getElementById("day_area").innerHTML  =
                                        DateStr(DayFormatStr);
    document.getElementById("date_area").innerHTML =
                                         DateStr(DateFormatStr);
    Begin_Flag = false;
   }

  if ((Min == 59) && (Sec == 59))
   {
    document.getElementById("sound").src  = "";
    document.getElementById("sound").src  = "bang.mid";
   }

  Timer = setTimeout("WriteTime()",TimeOut);
 }

WriteTime();
</script>
</body>
</html>

Как можно видеть, в HTML разметке присутствуют 3 элемента div с идентификаторами: time_area, day_area, date_area. В эти блоки будет выводиться время, название дня недели и дата соответственно.

Для конфигурирования скрипта можно изменять значения переменных:

ShowSeconds - задает режим отображения секунд в поле времени.
Если установлен в false, то секунды отображаются только до момента смены минут (скрипт синхронизируется), затем секунды не отображаются. Если значение переменной true, секунды отображаются всегда.

DayFormatStr - задает строку форматирования поля дня недели.
Возможные маркеры форматирования описаны в комментариях скрипта. По умолчанию значение этой переменной равно "%dddd%", то есть выводится просто название дня недели.

DateFormatStr - аналогично DayFormatStr, задает строку форматирования, но для поля даты. По умолчанию равна: "%D% %MM% %YYYY% года". Возможные маркеры форматирования описаны в комментариях скрипта.

--- * ---

Cкрипт фактически состоит из двух функций:

DateStr(TimeStamp) - принимает в качестве параметра строку-шаблон, содержащую маркеры типа: %D%, %MM%, %dddd% (см. комментарии в коде скрипта), получает текущее время и заменяет маркеры соответствующими значениями. Функция возвращает отформатированную по шаблону строку.

WriteTime() - вызывается периодически (с интервалом, задаваемым переменной TimeOut). Отображает изменения даты/времени, производя замену текста в блоках DIV с идентификаторами: time_area, day_area, date_area. В момент времени 59 мин. 59 сек. каждого часа проигрывает аудио файл bang.mid:

  if ((Min == 59) && (Sec == 59))
   {
    document.getElementById("sound").src  = "";
    document.getElementById("sound").src  = "bang.mid";
   }

bang.mid должен лежать в одном каталоге со скриптом (или надо указать путь до какого либо своего музыкального файла вместо bang.mid).

--- * ---

На сегодня - все.

Автор выпуска: Вахтуров Виктор.
Книги по C/C++
JavaScript. Наглядный курс создания динамических Web-страниц
JavaScript. Наглядный курс создания динамических Web-страниц

Автор: Келли Л. Мэрдок

Книга представляет собой уникальное наглядное пособие по основам программирования на языке сценариев JavaScript. В ней рассмотрены базовые средства JavaScript и методы их использования для решения конкретных задач, возникающих при разработке Web-страниц. Читатель узнает, как сделать Web-страницы динамическими, из более чем двухсот коротких уроков, каждый из которых основан на одном-двух примерах, наглядно демонстрирующих результаты работы операторов JavaScript. В книге содержится около 500 копий экранов с текстами сценариев и Web-страниц.

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

Страница книги на Озоне
JavaScript в Web-дизайне
JavaScript в Web-дизайне

Автор: Владимир Дронов

Книга посвящена языку сценариев JavaScript и его использованию в Web-дизайне. Дан вводный курс по языку HTML. Рассматривается работа JavaScript-сценариев в составе Web-страниц: общие принципы написания сценариев; управление элементами страниц на основеобъектной модели документа (DOM); организация взаимодействия с пользователем на основе событий; ввод-вывод при помощи Web-форм, диалоговых HTML-окон, Буфера обмена и технологии drag-n-drop; работа с базами данных; применение мультимедийных эффектов. Изложение сопровождается большим количеством примеров HTML-страниц с использованием JavaScript-сценариев. В приложениях к книге содержатся справочные сведения о HTML, CSS и DOM.

Страница книги на Озоне
Всего доброго. До встречи в следующем номере.
Любой из материалов, опубликованных в этой рассылке, не может быть воспроизведен в какой бы то ни было форме и какими бы то ни было средствами без письменного разрешения владельцев авторских прав.
Subscribe.Ru
Поддержка подписчиков
Другие рассылки этой тематики
Другие рассылки этого автора 		Подписан адрес:
Код этой рассылки: comp.soft.prog.javascript 		Отписаться
Вспомнить пароль
В избранное