jQuery

индекс
53,21

Как создать видео-проигрыватель на JQuery, HTML5 и CSS3 перевод

image

В этом уроке мы создадим видеоплеер из набора элементов пользовательского интерфейса «Impressionist UI» Владимира Кудинова. Для оформления мы будем использовать CSS3, а для реализации функциональности — MediaElement.js. MediaElement.js это HTML5 аудио и видео плеер, который также работает в старых браузерах имитируя MediaElement HTML5 API с помощью Flash и Silverlight.

ДЕМО
Исходные файлы

+52
17 мая 2012, 13:03
715
Lecaw 105,9

Отправляем теги в путешествие (jquery.waypoints)

Jquery.waypoints это плагин для реализации движения объектов по набору точек, так называемым вейпоинтам, с заданной скоростью и другими параметрами, физически имитирующие реалистичность. Частичное описание алгоритма было описано тут.


+5
14 мая 2012, 13:59
87
cybernetic 31,8

eachDeferred — отложенная обработка коллекции, one by one из песочницы

В ходе разработки текущего энтерпрайз-проекта, понадобилось реализовать отложенную обработку коллекции элементов jQuery — имелся набор виджетов, содержимое которых нужно было загрузить по очереди, причем загрузка происходила асинхронно. Пришлось написать небольшое расширение к $.fneachDeferred.
+3
10 мая 2012, 19:54
23
creage 2,5

Движение по точкам (waypoints) из песочницы

Сегодня мы будем рассматривать реализацию движения игрока по точкам — так называемым вейпоинтам (waypoints) в режиме 2D — а именно вид сверху.


+31
10 мая 2012, 12:48
233
cybernetic 31,8

Lake.js: плагин к jQuery для отражения иллюстраций как бы в воде озера

[скриншот]Стал известен скрипт lake.js плагин jQuery, который берёт иллюстрацию (элемент <img>) и помещает её на холст (вставляет элемент <canvas>), располагая сразу под нею зеркальное отражение, идущее волнами — будто в воде озера.

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

Холст имеет ту же ширину, что и обрабатываемая иллюстрация, и вдвое бóльшую высоту.

Вызов плагина выглядит сравнительно просто и самоочевидно:

<script src="jquery.js"></script>
<script src="lake.js"></script>
<script>
$(function() {
   $('#lake-img').lake({
      'speed': 1,
      'scale': 0.5,
      'waves': 10
   });
});
</script>
...
<img id="lake-img" src="lake.png" style="display: none;"/>

+2
4 мая 2012, 09:57
58
Mithgol 107,9

Расширение для jQuery: Execute Object

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

Плагин позволяет передавать команды манипуляции ДОМом в одном объекте, то есть заменить много вызовов методов одним вызовом функции.

Использование


$.executeObject({"#my_div": ["text", "новый текст"]})   // можно передать объект
$.executeObject('{"#my_div": ["text", "новый текст"]}') // а можно и JSON

–1
27 апреля 2012, 14:06
27
bubuq 36,0

Внутренности jQuery. Поиск кода, выполняемого по событию

Чем дальше в лес, тем толще партизаны. Нет, не так. Чем старше веб, тем больше джаваскрипта

Клиентского кода в веб-приложениях с каждым годом действительно становится все больше. Подчас это десятки файлов с сотнями функций. И что делать, когда нам нужно поменять код, выполняемый по событию (например, клик по ссылке). Как его найти? Задавшись решением этой задачи, я придумал несколько разных вариантов. Каждый из них имеет свои плюсы и минусы. И в конце статьи я предлагаю метод, который мне кажется оптимальным.
+118
27 апреля 2012, 00:01
501
TedMosby 144,0

Лица .тостер {javascript}: Ральф и Ян

Привет, любители .тостов!

Вместе с вами мы с нетерпением ждем наступления пятницы 25-го мая, когда на одной сцене сойдутся одни из лучших javascript-ориентированных программистов со своими мыслями о настоящем и будущем.

А пока остается почти месяц до события, которое мы стремимся сделать лучшим кодо-ориентированным событием до летних каникул — продолжим знакомиться со спикерами .тостер {javascript}.

image

Знакомьтесь: миловидный мужчина в правой части фотографии — Ральф Уитбэк, со-автор подкаста Official jQuery и senior developer в компании appendTo, по-совместительству — участник jQuery Foundation. Здесь опубликованы наиболее интересные отрывки нашего разговора с Ральфом о технологиях, работе и разработке:

+7
26 апреля 2012, 18:16
12
Shapelez 177,0

jQuery UI Bootstrap Theme

На проектах использую Twitter Bootstrap и jQuery UI для прототипирования интерфейсов различных элементов страниц в т.ч. форм.

На днях понадобилось дополнить форму одним полем. Был выбран наиболее подходящий формат, в виде набора переключателей (элемент input, тип radio).

В Twitter Bootstrap, набор переключателей представлен в виде набора кнопок и не работает напрямую с элементом input, что предполагает написание дополнительного кода для обработки событий. Библиотека jQuery UI, имеет решение подобной задачи, и вся обработка событий уже реализована.
+29
25 апреля 2012, 14:12
235
lebster –5,9

jQuery плагин для проигрывания музыки с youtube

Как известно, youtube является крупнейшим видеохостингом в мире.
Помимо прочего, здесь хранится как огромное музыкальных клипов, так и просто песен. Дело в том, что ютуб очень часто используют и как хостинг для аудио композиций, видимо потому что в интернете не существует специализированного аудиохостинга. Таким образом возникла идея сделать аудио плеер на основе музыкальных роликов из ютуба…
+12
23 апреля 2012, 16:15
98
sindrom 22,5