Создание ролловера для ломтика

Откройте изображение,

содержащее ломтики, и отобразите палитру Slice (Ломтик).
Активизируйте инструмент Slice Select (Выделение ломтиков) с помощью клавиши К (сочетания клавиш Shift+K) и щелкните по ломтику, для которого следует создать ролловер.
Если элемент изображения, на основе которого должен быть создан ролловер, не имеет своего собственного слоя, воспользуйтесь командой Select > Create Selection from Slice (Выделить> Создать выделение из ломтика), а потом выполните команды Layers > New > Layer via Сору (Слои > Новый > Слой из копии) или нажмите комбинацию клавиш Ctrl+J. Если изображение, принадлежащее ломтику, уже находится на отдельном слое, то создайте дубликат слоя с помощью палитры Layers (Слои).
Откройте вкладку Rollover (Ролловер). Миниатюра выделенного ломтика будет видна на палитре.
В нижней части палитры щелкните по кнопке Create new rollover state (Создать новое состояние ролловера) - см. рис. 23.107. Копия выделенного ломтика появится на палитре в качестве новой миниатюры.
Программа ImageReady по умолчанию автоматически связывает состояния курсора и кнопки мыши с миниатюрами ролловеров в такой последовательности: Over (Над), Down (Нажатие) и Click (Щелчок). Если же необходимо изменить эту последовательность, то из всплывающего меню, расположенного над миниатюрой нового ролловера, который вы создадите при выполнении последующих шагов, выберите состояние, которое будет инициировать ролловер (рис. 23.106):

Рис. 23.107. Выбор состояния курсора и кнопки мыши, инициирующего ролловер

Рис. 23.108. Инвертирование цвета изображения в состоянии Over

Рис. 23.109. Скрытие исходного слоя и показ дубликата на палитре Layers

Over - курсор находится над ломтиком, кнопка мыши не нажата;
Down - курсор находится над ломтиком, кнопка мыши нажата. Некоторые Web-дизайнеры любят выводить специальную картинку-при на-жатии кнопки мыши;
Click - щелчок кнопкой мыши по указанному ломтику (кнопка нажата и отпущена). При этом браузер попытается установить связь в сети, используя URL-адрес, прикрепленный к данному ломтику.

Отредактируйте изображение на отдельном слое или на дубликате сдоя (см. шаг 3), чтобы оно как-то отличалось от исходного. Инвертируйте цвет слоя (рис. 23.108) или измените яркость с помощью команд Image > Adjustments О Invert (Изображение > Корректировки > Обратить), примените к слою текстурный или искажающий фильтр (см. раздел «Еще кое-что о ролловерах») или измените цвета и их насыщенность в слое. Также можно заменить изображение на совершенно другое или использовать новое изображение в качестве дополнения к уже существующему, расположенному в пределах ломтика. При этом изображение на исходном слое не изменится.
На палитре Layers (Слои.) отобразите дубликат слоя и скройте исходный слой (рис. 23.109).
Переключайте на палитре Rollover (Ролловер) состояние Normal и миниатюры ролловеров и наблюдайте за видом исходного изображения в основном окне. На палитре Rollover отображаются все изменения, происходящие на палитре Layers (Слои) по мере выбора миниатюр ролловеров. Чтобы картинка в окне предварительного просмотра была более достоверной, воспользуйтесь командой File > Preview in [браузер] (Файл > Предварительный просмотр в [браузер]) либо новой функцией предварительного просмотра программы ImageReady (см. раздел «Предварительный просмотр роллове-ра в программе ImageReady»),

Внимание

При редактировании слоя всегда помните о том, какая миниатюра выбрана на палитре Rollover. Все миниатюры должны содержать различные виды изображения.

Совет

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

Совет

Можно создать отдельное изображение для каждого состояния ролловера (например, один значок для режима Over (Над) и другой - для режима Click (Щелчок)). Просто не забудьте создать отдельный слой или эффект слоя для каждого состояния.

Совет

Для того чтобы выбрать размер миниатюры, отображаемой на палитре Rollover (Ролловер), дважды щелкните по серому фону палитры (или выберите команду Palette Options (Опции палитры) в меню палитры Rollover). Крупные миниатюры легче рассматривать. У палитр Animation (Анимация) или Slice (Ломтик) свои собственные размеры миниатюр.

Совет

Для того чтобы создать ролловер, в котором новое изображение добавляется к уже существующему, создайте новую картинку на скопированном или дополнительном слое. Далее убедитесь, что ее размеры и местоположение сочетаются с исходным изображением (рис. 23.110 и 23.111). В этом случае исходный слой будет всегда виден.

Рис. 23.110. Изображение в состоянии золловора Normal

Рис. 23.111. То же изображение в состоянии Over. Злой с нарисованным от руки эффектом вешнего свечения виден под слоем с лампочкой

Рис. 23.112 .Исходная кнопка

Рис. 23.113 . Кнопка после применения фильтра Radial Blur

Рис. 23.114 . Кнопка после применения фильтра Pinch

Еще кое-что о ролловерах

Предлагаем вам использовать следующие приемы при редактировании скопированного слоя (см. шаг 7 раздела «Создание ролловера для ломтика»).

Для создания эффекта расширения/сжатия изображения с помощью ролловера выполните масштабирование картинки на скопированном слое, воспользовавшись командами Edit > Transform > Scale (Правка > Трансформировать > Масштабирование) или Filter => Blur > Radial Blur (Фильтр > Размытие > Радиальное). В результате изображение будет растянуто (рис. 23.112 и 23.113). А при выполнении команд Filter > Distort > Pinch (Фильтр > Искажение > Дисторсия) (с отрицательным значением параметра Amount (Количество)) изображение будет выпячено (рис. 23.114).

Для того чтобы кнопка или область изображения казались перевернутыми, воспользуйтесь командами Edit > Transform > Flip Horizontal (Правка > Трансформировать > Перевернуть вдоль горизонтали) или Flip Vertically (Перевернуть вдоль вертикали) - см. рис. 23.105.

Содержание раздела