Материалы с тегом «анимация»

• Google и Arcade Fire: как соединить технологии и искусство

  Что будет, если взять команду из Google, рок-группу, режиссера и приправить все HTML5 и JavaScript?

• jQuery.color — учим animate работать с цветом

  Для динамического изменения свойств в jQuery служит функция animate. Но ее возможности не безграничны. Она не умеет работать со свойствами заданными в виде кода цвета. Исправляет ситуацию плагин jquery.color

• jquery.flip — плагин для переворота контента

  Рассмотрим плагин Flip-jQuery, который реализует интересный эффект — создает иллюзию вращающегося контента.

• jQuery.ScrollTo. Программная перемотка скролла

  Плагин может перематывать как главный скролл окна, так и скролл какого-нибудь элемента. Реализована перемотка в определенную позицию (в пикселях или процентах) или к какому нибудь конкретному элементу (заданному, например, по id). Все просто, быстро и удобно.

• jQueryRotate — крутим картинки

  Плагин умеет кроссбраузерно вращать картинки на любой угол. Кроме статического поворота реализовано и анимированное вращение.

• Анимация в CSS3. Часть I

  CSS3 свойство animation позволяет создавать анимированые переходы без помощи javascript. Safari 4+ и Chrome 3+ уже сейчас поддерживают это свойство с вендорным префиксом -webkit-. Итак, разбираем CSS3 анимацию.

• Анимация в CSS3. Часть II

  Продолжаем разбирать CSS3 анимацию. Вторая часть статьи посвящена особенностям применения нескольких анимаций к одному элементу, а также управлению анимацией.

• Аппаратное ускорение анимации

  CSS3 анимация для повышения производительности.

• Блик на тексте

  Пробегающий блик на тексте средствами Javascript.

• Оптимизация DOM анимации. Приоритетность оптимизаций.

  Перечень действий, направленные на оптимизацию DOM/CSS анимации.

• Программная анимация

  Оптимизируем анимацию на чистом Javascript.

• Свойство animation

  Css свойство animation — сокращенный способ задать свойства анимации animation-name, animation-duration, animation-timing-function, animation-delay, animation-iteration-count, animation-direction, позволяет одновременно задать имя анимации, время анимации, способ определения промежуточных значений изменяющихся параметров, задержку анимации, количество циклов анимации и возможность ее проигрывания в обратную сторону.

• Свойство animation-delay

  Css свойство animation-delay задает время задержки анимации (можно указать несколько через запятую).

• Свойство animation-direction

  Css свойство animation-direction определяет, нужно ли проигрывать анимацию в обратном направлении (можно указать несколько через запятую).

• Свойство animation-duration

  Css свойство animation-duration задает продолжительность одного цикла анимации (можно указать несколько через запятую)

• Свойство animation-iteration-count

  Css свойство animation-iteration-count определяет количество циклов анимации (можно указать несколько через запятую).

• Свойство animation-name

  Css свойство animation-name задает имя анимации, при обращении к которому будет производиться анимация (можно указать несколько через запятую).

• Свойство animation-play-state

  Css свойство animation-play-state определяет, работает ли анимация или стоит на паузе (можно указать несколько значений через запятую).

• Свойство animation-timing-function

  Css свойство animation-timing-function описывает метод расчета промежуточных значений свойств для анимации (можно указать несколько через запятую).

• Свойство transition

  Css свойство transition — сокращенный способ задать свойства перехода transition-property, transition-duration, transition-timing-function и transition-delay, позволяет одновременно задать свойство, к изменению которого будет применен плавный переход, время, в течение которого этот переход будет совершаться, способ расчета промежуточных значений перехода и задержку перед переходом.

• Свойство transition-delay

  Css свойство transition-delay указывает на временную задержку перед анимированным переходом (можно указать несколько через запятую).

• Свойство transition-duration

  Css свойство transition-duration указывает какое количество времени занимает анимированный переход (можно указать несколько через запятую).

• Свойство transition-property

  Css свойство transition-property задает свойство, для которого будет совершаться анимированный переход (можно указать несколько через запятую).

• Свойство transition-timing-function

  Css свойство transition-timing-function указывает на временную задержку перед анимированным переходом (можно указать несколько через запятую).