Как сделать совет дня

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

Слои позволяют создать документ, содержащий множество советов и их последовательный показ, без перезагрузки и обновления файлов. Это можно сделать с помощью всплывающего окошка, которое появляется поверх самого сайта, либо в каком-нибудь месте веб-страницы. Основная сложность при использовании слоев — сделать код универсальным для различных браузеров, чтобы информация отображалась идентично и корректно.

Особенности браузеров

1. При помещении слоя внутри таблицы, его ширина совпадает с шириной ячейки таблицы. Браузер Opera, однако, независимо ни от каких таблиц, всегда делает ширину слоя равной ширине окна браузера. Чтобы обойти эту особенность можно воспользоваться параметром width, который определяет ширину слоя. Значение можно задавать как в процентах, так и пикселах.

Если еще задана ширина таблицы, внутри которой расположен слой, Internet Explorer и Netscape станут отмерять значение параметра width от ширины таблицы, поэтому ее лучше указать 100%.

2. При скрытии с помощью параметра visibility, слой не удаляется из потока документа. То есть, если спрятать таким образом слой, он станет невидимым, но место, которое он занимает, останется. Если предполагается вывод разных слоев в одно и то же место экрана, для обхода этой особенности следует использовать абсолютное позиционирование. Справедливости ради, надо отметить, что браузеры Internet Explorer 4, Netscape 6 и выше все же могут динамически управлять выводом элементов на экран с помощью свойства display.

Использование слоев

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

Чтобы при загрузке страницы автоматически определялось, какой именно совет показывать сегодня, следует написать скрипт делающий видимым определенный слой и вызывать его, например, через событие onLoad.

Для простоты считаем, что в каждом месяце 31 день. Затем определяем общее число дней, прошедших с начала года, делим на количество советов, остаток от этого деления и будет номером сегодняшнего совета.

Переход к следующему совету

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

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

Такая ссылка вызывает функцию JavaScript с именем goNext, которая описана ниже.

Полный листинг

Полный код программы для создания совета дня представлен ниже.