Рассмотрим интересный пример создания слайдера для меню при помощи свойства CSS3 transition.
В примере не используются сценарии JavaScript, только CSS, а точнее свойство CSS3 transition.
У примера есть интересная особенность - картинка уезжает влево или вправо в зависимости от позиции указателя мыши в момент входа в область меню. Подобное поведение создает необычные эффекты, если медленно двигать мышкой между соседними элементами меню.
Как уже говорилось, в примере не используется JavaScript, а только CSS. Там ничего сложного. Формируется меню из списка и ссылок, заполняется фоновой картинкой (цветной прямоугольник и изображение предмета), и далее используется CSS-анимация.
Источник: Stu Nicholls | CSSplay | CSS3 - The future now - Left/Right Slide
Вернуться в раздел CSS