Измерим расстояние от верхнего края получившегося комбинированного
Изображения до верхней границы каждого последующего изображения.
На рис. 9.9, вверху, верхняя граница сменного изображения-ролловера имеет
Смещение от верхнего края общего изображения в 39 пикселов.
Создадим СSS-стиль для ссылки в обычном иенажатом состоянии. Поместим
Изображение в качестве фонового в левый верхний угол стилизуемой ссылки
(см. рис. 9.9, посередине).
Стиль может выглядеть следующим образом:
а { background: #Е7Е7Е7 url(images/pixy.png) no-repeat left top: }
Создадим стиль :hover. Будем использовать свойство background-pos i t i on, чтобы
Сместить изображение вверх. Таким образом, первое изображение исчезнет, авторое,
Нижнее, изображение-ролловер окажется видимым (см. рис. 9.9, внизу).
a:hover { background-position: О -39рх: }
Такая методика, помимо предотвращения длительной задержки в загрузке дополнительного
Изображения-ролловера, обеспечит хранение всех изображений
Кнопки, отражающих ее состояния, в единственном файле.
СОВЕТ -------------------------------------------------------
CSS предоставляет и другие способы предварительной загрузки изображения. Его можно поместить
В качестве фонового, но оно будет прикрыто сверху другим рисунком, основным. Предположим,