|    | 
СИ-БИ техника | КВ техника | УКВ техника | Радиоизмерения | Защита от TVI | Источники питания | Софт | Расчеты | Справочники
Главная arrow Программирование arrow Java arrow Управление внешним видом элементов страницы  

Управление внешним видом элементов страницы

Оглавление
Управление внешним видом элементов страницы
Страница 2
Страница 3
Страница 4
Страница 3 из 4

Пример

Вот HTML-код небольшой Web-страницы, в которой после ее открытия шрифт второго и четвертого абзаца увеличивается:

<HTML> <HEAD>

<TITLE>Манипуляции стилем</TITLE> <STYLE>

.para { font-size: 10pt; } </STYLE> </HEAD> <BODY>

<P CLASS="para">Это небольшой текст.</Р> <Р>Это другой небольшой-текст.</Р> <Р CLASS="para">Это третий небольшой текст.</Р> <Р>Это четвертый небольшой текст.</Р> <SCRIPT TYPE="text/javascript">

for (var i = 0; i < document.all.length; i++) {

var elObject = document.all[i]; if (elObject.className == "para") elObject.style.fontSize = "24pt"; } </SCRIPT> </BODY> </HTML>

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

Как реализовать простейшие анимационные эффекты?

Проблема

Я хочу для привлечения внимания сделать мерцающую рамку у одного из абзацев. Как это сделать?

Решение 1

Нет ничего проще! Для этого достаточно менять цвета рамки через определенное время. И в этом нам поможет метод setinterval объекта window, формат вызова которого приведен далее. Этот метод занимается тем, что создает так называемый таймер, который выполняет заданное нами выражение через определенные интервалы времени.

window.setInterval(<Выражение>, <Интервал>);

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

Выражение, которое мы передаем методу первым параметром, может делать все что угодно. В нашем случае оно может осуществлять изменение цвета рамки абзаца, чтобы создать эффект ее мерцания. Также мы можем с помощью этого выражения обновлять какие-то данные на Web-странице, изменять положение какого-либо из свободно позиционируемых контейнеров (так, кстати, создается "настоящая" анимация) или делать что-то еще.

Народ советует

Анимационные эффекты на Web-странице нужно использовать очень умеренно и только для привлечения внимания к чему-то очень важному. Вряд ли посетителям нашего сайта понравится, если страницы будут мигать на все лады, как новогодняя елка!..

Метод setlnterval возвращает особый идентификатор таймера, который желательно сохранить в переменной. Впоследствии этот идентификатор может нам понадобиться.

Народ предупреждает!

Не следует1 путать методы setlnterval и setTimeout! Первый выполняет заданное выражение многократно через заданные интервалы времени, в то время как второй делает это всего один раз, после того истечения интервала.

Заданное нами в первом параметре метода setlnterval выражение будет выполняться до бесконечности, пока мы не закроем Web-страницу или не выполним метод clearmterval объекта window. Этот метод удаляет созданный методом setlnterval таймер; формат его вызова таков:

window.clearInterval(<Идентификатор таймера>);

Первым параметром этому методу передается возвращенный методом setlnterval идентификатор таймера. Результата метод clearInterval не возвращает.

Народ советует

Если мы хотим, чтобы анимационный эффект продолжался бесконечно (в смысле, все время, пока открыта данная страница), идентификатор таймера нет нужды сохранять в переменной.


« Пред. - След. »


RLBN.ru - Электроника и компьютеры

0.1394
Hosted by uCoz