Наши контакты:
Обратная связь:
 
044383 30 94Не звоните ночью, уважаемые!
 
Живое меню с CSS3
Сейчас мы покажем вам, как разнообразить ваше меню, добавив аккуратный эффект при наведении на него. Идея состоит в том, чтобы плавно показывать изображение при наведении курсора на пункт меню.

Каждый пункт меню будет иметь якорь, содержащий два пролета и изображения:
 Далее стилизуем наш список. Мы дадим .mh-menu цвет фона RGBA (255 255 255, 0,8). А при наведении курсора меняем цвет фона на RGBA (225 239 240, 0.4):
 Второй шаг сделать все елементы списка своим другим цветом при наведении:

Изображение будет появлятся с правой стороны, поэтому на начальном этапе, оно будет находится слева. Мы также добавим для плавного перехода прозрачность  от 0 (начальное значение) до 1:
 Вот и все, мы имеем хороший выдвигающейся эффект! Убедитесь, что z-индекс якоря был выше, чем изображение, чтобы оно находилось под якорем, а не на нем. Кроме того, мы можем сделать цвет фона якоря непрозрачным при наведении курсора мыши, то есть полностью белым (демо 2), или цвета всех елементов списка разным (демо-3).