JQUERY библиотеки и скрипты для анимации

Часто, работая с темами WordPress, я натыкаюсь на анимацию, созданную при помощи JavaScript библиотек. Самая популярная, о которой думаю слышало большинство тех, кто заходит на сайт это jquery. Библиотека отличная но слишком популярная чтобы писать о ней еще один из сотен тысяч раз. Перекладываю эту затею на тех читателей которые ведут свои блоги. Можете предлагать свои ссылки в комментариях.

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

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

Первый пагин jquery анимирует текст. Всего 5 видов анимации.

Для работы с плагинном анимации текста необходимы:

Библиотеки: jQuery , jQuery UI.
Поддерживаемые браузеры: Firefox 3.x+, Google Chrome2.x+, IE8+, Safari5.x+

Анимация текста jquery javascript

Пример анимации текста и сам плагин в архиве:

Скачать

 

Отличная анимация и все при помощи CSS3. Анимируем загрузку на странице.

css3 загрузка

 

Скачать можно тут:

Скачать

 

jAniальтернативная анимация картинок в jpeg формате.

jAni — простой плагин для JQuery который позволяет оживить фоновые изображения. Плагин в основном альтернатива GIF-анимации, но с несколькими преимуществами и недостатками.

Во-первых, всегда лучше использовать анимированные GIF изображения, так как этот формат поддерживается всеми браузерами без кода JavaScript или дополнительной разметки, но  формата GIF есть и крупный недостаток в качестве изображения. Анимированный GIF позволяет работать только с 256 цветами, и вы не можете управлять анимацией так как хочется вам. jAni загружает длинные вертикальные изображения, добавляет их в фон блока и меняет положение фона с той скоростью с которой вы настроите, что дает вам больший контроль над анимацией.

Скачать можно тут

 

Анимация с постоянной прокруткой jquery

Долгое время шли споры как правильно делать анимацию на сайте и раньше небыло лучшей альтернативы чем flash. С появлением JavaScript библиотек и новых возможностей CSS3 все кардинально изменилось. Теперь не надо подключать третью сторону в виде flash player. Всегда искал как делается анимация такого рода в премиум шаблонах, с постоянной прокруткой фона и перемещение объекта по сайту. Рассмотрим отличный плагин jQuery.spritely.

jQuery.spritely анимация при помощи jquery

Для использования библиотеки и просмотра демонстрации работы плагина перейдите на официальный сайт плагина.

Сайт плагина

 

Parallax

 

jquery parallax effect pluginГод назад закончил университет и делал для них сайт, в шапке сайта я использовал эффект JParallax. На то время считал что вещь крутая и ничего подобного долго еще не придумают. Недавно на всем известном Хабрахабре нашел статью об этом прекрасном плагине с примерами его использования и разными его реализациями в виде других плагинов. Рассмотрим все что выросло из паралакса и сплошь и рядом используются в премиум шаблонах.

Плагины для создания параллакс-эффектов:

Уроки по работе с паралаксом (англ.)

Примеры использования Parallax

Для тех кто скажут что статья сухая напомню что это всего лишь заметка для себя и возможно она кому-то еще понравиться. Если у вас есть чем дополнить, пишите в комментариях.


Читайте также:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Шаблоны для WordPress
Самый лучший хостинг в Украине
Стабильный хостинг для Drupal