Библиотека Scriptaculous содержит массу красивых и полезных эффектов, которые удобно использовать в web приложениях. О некоторых из них я уже писал в предыдущих статьях (например, Подсветка элементов web страницы и Использование Scriptaculous для изменения прозрачности элементов web страницы). Любой из этих эффектов представляет ценность сам по себе, но только использование их комбинаций позволяет раскрыть возможности библиотеки в полной мере.

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

Прежде всего, немного теории. Scriptaculous позволяет применить несколько эффектов к одному и тому же блоку web страницы двумя способами:
1) последовательно (эффекты будут применяться по очереди);
2) параллельно (т.е. все выбранные эффекты будут работать одновременно).

Рассмотрим небольшой пример. Допустим, у нас есть web страница с текстовым блоком, к которому мы хотим применить два эффекта:
1) подсветки (Highlight);
2) и перемещения (MoveBy).

Разметка страницы предельно простая:

Как видите, страницы содержит один блок (textBlock) и две кнопки, нажатия на которые вызывают javascript функции runParallel() и runSerial(). Эти функции будут запускать наши эффекты параллельно и последовательно.

Теперь представим, что мы написали такой код:

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

Отсюда простой вывод: “Если используете несколько эффектов, всегда указывайте, в каком порядке их выполнять”.
Читать дальше »

Сложно представить современный интернет без форм для ввода данных. Они повсюду. Практически все web сервисы требуют авторизации или, как минимум, ввода имени и адреса email. Для ускорения работы с формами существуют специальные программы, многие браузеры имеют функцию автозаполнения…. Но сегодня речь не о них.

Мы посмотрим, как сделать обычную html форму удобнее для посетителей. И, кроме того, сделаем ее доступной для программ чтения с экрана, текстовых браузеров и тому подобного софта.
Читать дальше »

Существует множество способов привлечь внимание посетителей к элементам web страницы. К ним относятся: выделение с помощью цвета, размера и начертания шрифтов, добавление рамок и фоновых изображений, взаимное расположение элементов и множество других способов.
Но иногда возникают ситуации, в которых необходимо привлечь внимание пользователя к элементу только на небольшой промежуток времени. Например, при возникновении какого-нибудь события. Сегодня я покажу один из возможных вариантов решения этой задачи.
Идея очень простая.
Читать дальше »

Современные JavaScript библиотеки позволяют кардинально изменять внешний вид страницы с помощью буквально нескольких строчек кода. В этой статье я покажу как с помощью библиотеки Prototype можно изменить стили практически любого набора элементов на html странице.
Читать дальше »

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

В этой статье мы посмотрим, какие возможности предоставляет Scriptaculous для изменения размеров элементов web страницы.
Читать дальше »

В этой статье речь пойдет о возможностях, которые предоставляет библиотека Scriptaculous для управления прозрачностью элементов web страницы.
Читать дальше »

Все чаще в дизайне новых web сайтов встречается верстка в несколько колонок. Применений для такой верстки множество. Например, дублирование навигационного меню в нижней части страницы. В этой статье я покажу один из вариантов такой верстки. При этом html таблицы мы использовать не будем, а расставим колонки с помощью каскадных таблиц стилей (CSS).
Читать дальше »

В интернете можно найти массу примеров верстки страницы в две колонки. Но у большинства из них есть недостаток: нельзя установить разделитель между колонками нужной длины.
Читать дальше »

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