7 Text

Textualizer - эффекты над текстом

Textualizer - jQuery плагин для создания красивых эффектов над текстом. Поддерживается работа в: Chrome, Safari 4+, Firefox 3.5+, IE 6,7,8,9+, Opera 10.6+, Mobile Safari (iOS 4)  

Textualizer - эффекты над текстом
14 Layout

Размытость элементов

В этом уроке посмотрим, как сделать простой эффект размытости для тексто содержащих элементов. Идея заключается в том, что у нас есть ряд текстовых контейнеров, которые будут размыты и уменьшены, как только курсор мыши окажется над областью в которой они размещены, а элемент на который наведен курсор увеличится, т.е. внимание сфокусируется именно на нём.

Размытость элементов
16 Buttons

Анимированные кнопки

Будем создавать анимированные кнопки с помощью свойств CSS3, которые реагируют на наведение мышки и нажатие. Работать должным образом будут только в поддерживаемых CSS3 браузерах. В некоторых примерах будут использоваться иконки от  webiconset.com и символы от Just Be Nice.

Анимированные кнопки
9 Text

Интерактивный текст на HTML5

Очень необычно и красиво сделанный интерактивный типографический эффект с использованием canvas. Будем создавать динамические баннеры, для оживления сайта. Работать будет по разному и не во всех браузерах.

Интерактивный текст на HTML5
43 Parallax

Параллакс эффект

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

Параллакс эффект
15 Zoom

Easy zoom плагин

Плагин для увеличения отдельных элементов изображения при перемещении курсора по нему.

Easy zoom плагин
11 Buttons

Увеличение иконки при наведении

Эффект почти такой же, как и у Apple Dock - иконка увеличивается в размерах при наведении. Реализуется только на CSS? поэтому плавности не будет, как если бы мы использовали jQuery.

Увеличение иконки при наведении