Рубрика «javascript» - 558

Modernizr: практическое применениеModernizr — это JavaScript-библиотека, которая узнаёт, что из HTML5 и CSS3 умеет браузер пользователя. Определяя возможности браузера, разработчик может сделать откат некоторых функций для старых версий браузеров. Создатели Modernizr называют такую проверку feature detection, и это гораздо эффективнее, чем просто определить браузер, его версию и ОС.

Я был премного удивлён факту отсутствия развёрнутой статьи об этой JS-библиотеке (анонс не в счёт). Статья составлена из перевода официальной документации проекта, переводов нескольких статей и собственных дополнений.

Первый шаг

Для начала нужно получить свежую версию библиотеки с её официального сайта: Modernizr Download Builder.
Укажи галочками те технологии, тесты которых собираешься проводить, затем создай свою персональную версию библиотеки кнопкой «Generate». Если проставить все галочки, получившегося кода хватит на пару экранов небольшого ноутбука – всего 15 КБ.
Затем просто подключи его к своей странице и проверь, как оно. Если всё работает, у элемента HTML должны появиться многочисленные классы: Читать полностью »

Адаптивная верстка: CSS&JS фреймворк Skeleton
В продолжение недавней статьи про адаптивную верстку, хочется более полно раскрыть тему. В реалиях, чаще всего, для адаптивной верстки используют CSS-фреймворки. Об одном из них я хотел бы рассказать, а если точнее – перевести мануал по ее использованию. Называется он Skeleton.
Читать полностью »

Сегодня у меня две причины пробежаться по клавишам.

Во-первых, после того, как на прошлой неделе я перевёл документацию по jParser (после ознакомления с RReverserовским примером применения jParser при анализе BMP-файлов), мне представляется уместным перейти к напрашивающемуся последующему шагу: развить тему, поделиться с читателями моим собственным примером применения jParser для анализа несколько более сложной структуры данных. (Отчасти это станет ответом на вопрос, который alekciy задал, интересуясь дальнейшими примерами практического использования jParser.)

Node.js на узле Фидонета: читаем джаваскриптом заголовки эхопочты, хранимой в формате JAMВо-вторых, ≈полгода назад (26 ноября 2011 года) ertaquo поинтересовался, зачем мне хочется использовать Node.js в Фидонете. Тогда я сообщил, что мне просто нравится название (помню те времена, когда термин «node» или «нóда», если употреблялся без уточнения, в российском околокомпьютерном мире по умолчанию означал узел Фидонета), но не мог привести никакого наглядного примера работающего кода, а сейчас приведу.

Итак, пример будет двойным. Предлагаю вашему вниманию анализ заголовков писем фидонетовской эхопочты, хранимой в формате JAM. Этот формат популярен в Фидонете со времён далёких и незапамятных (в Википедии говорится, что появление JAM относится к 1993 году). Сразу скажу, что давно предпочитаю JAM другому популярному формату (Squish), потому что этот последний хранит в заголовке у письма идентификаторы не более чем девяти откликов на него, тогда как JAM вместо массива ограниченной длины использует более гибкую структуру данных (связный список), так что позволяет выстроить полное дерево ответов даже в самых оживлённых и разветвлённых обсуждениях.

Читать полностью »

Пишем и оптимизируем Жизнь Конуэя на JSОбновляя недавно дизайн своего хомяка, подумал – а не сделать ли мне какую-нибудь необычную страницу с 404-й ошибкой? Поскольку в детстве я был впечатлен Жизнью Конуэя (как возможно и многие из читателей), решил её на JS и реализовать.

Казалось бы, что сложного в Жизни: если у занятой клетки 2 или 3 соседа – она остается, если у пустой ровно 3 – рождается? В этой статье я и расскажу о своей оптимизации алгоритма и отрисовки в canvas-е, и некоторых не очевидных моментах целочисленной/бинарной арифметики в JavaScript.

Забегая вперед, конечный результат можно увидеть тут, исходники видны там же (да еще и по лицензии CC BY).Читать полностью »

Ну что же плывем дальше, а на очереди следующие 4 функций, связанные с путешествием по Антоновке. Для начала определимся с понятием «чего надобно». Итак, я хочу:

  • выбирать элементы по атрибуту ID;
  • выбирать элементы по атрибуту NAME;
  • выбирать элементы определенного тэга;
  • выбирать элементы определенного класса.

Читать полностью »

Сейчас почти не осталось препятствий для создания полноценного SIP клиента в браузере. Необходимый для видео конференций WebRTC уже можно протестировать, например, в Chrome Canary. Существует draft-ibc-sipcore-sip-websocket, который добавляет WebSocket в качестве еще одного транспорта для SIP. И уже появляются первые реализации SIP клиентов:

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

Читать полностью »

Greensock — теперь и для JavaScript

Удивительно, но факт: на хабре практически нет статей о Greensock — великолепной библиотеке для скриптовой анимации на Flash. Возможно, это связано с тем, что Flash-разработчиков тут меньше, чем веб-разработчиков?

Впрочем, теперь уже не важно: Greensock v12 (он же Greensock Animation Platform или GSAP) умеет анимировать на JavaScript. Любое свойство любого объекта можно проанимировать десятками способов, соединить анимации в таймлайн, поставить этот таймлайн на паузу или развернуть задом наперёд. Всего парой строчек.

Более того, Greensock работает значительно быстрее jQuery, YUI, MooTools или Dojo. Разработчики говорят о тысячах процентов, но зачем верить на слово, когда есть animation speed test.

Подробности на английском: www.greensock.com/v12/, а под катом — краткое изложение на русском языке.
Читать полностью »

Ну что же ползем дальше. Надо же нам как-то уметь передвигаться по Антоновке, поэтому давайте рассмотрим первые пять функций, которые реализуют «простенькие шажки» по DOM.
Читать полностью »

По следам предыдущей статьи, которая была чуть более месяца назад, о количестве скачиваний юзерскрипта для сайта habr.ru, появилось ещё одно интересное явление, которое заслуживает рассмотрения. Если предполагать, что никакой накрутки нет, то его можно объяснить только масс-эффектом — влиянием большого числа — показателя скачиваний на ещё более быстрый рост этого числа.
Читать полностью »

Многие пользователи пренебрегают сайтами с медленной загрузкой. Ian Culshaw объясняет, как использовать SVG Raphaël библиотеку что бы создать прелоадер, который будет удерживать внимание пользователей во время загрузки страниц.

image

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

Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js