Рубрика «html» - 87

10 февраля Консорциум Всемирной паутины объявил о том, что стандарт, описывающий API для управления вибрацией, получил статус рекомендованного. Сама по себе возможность заставить браузер повибрировать устройством была доступна уже некоторое время, но только сейчас она была наконец-то оформлена рекомендованной спецификацией, так что пришла пора подумать, как и где это можно использовать на повседневной основе. Впрочем, уже в самом начале авторы стандарта предупреждают, что API разработан специально для тех случаев, когда требуется простая тактильная обратная связь, и он не предназначен для использования в качестве общего механизма уведомления пользователя. Для уведомлений рекомендуется использовать Notifications API.

Желающие приобщиться к официальной спецификации со всеми её нюансами могут это сделать на сайте W3C, а здесь мы лишь бегло посмотрим на то, как всё это можно использовать, а также осветим некоторые моменты, не раскрытые в документации.
Читать полностью »

Буквально недавно Крис написал про «Эффект капельного преобразования в CSS». Эффект реально крутой и сама техника реализована по-умному, но данный подход через обычные CSS фильтры имеет определенные недостатки: нельзя использовать непрозрачность, добавлять контент внутрь капель, проблемы с фоновыми цветами.

В последние дни я достаточно много экспериментировал с SVG фильтрами и заметил, что с их помощью можно решить вышеописанные проблемы в CSS реализации. Посмотрите на липкое меню, которое я сделал для демонстрации:

CodePen
Липкий эффект - 1

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

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

Языки пламени в CSS - 1

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

На определенном этапе развития программной системы неизбежно возникает задача разработки пользовательской документации. И тут возникает технический вопрос выбора форматов и инструментов разработки документации.
Читать полностью »

Я люблю использовать SVG везде, где это только возможно.

При создании front-end я разделяю всю графику на две категории:

  1. “контент” — изображения, которые меняются в зависимости от содежимого
  2. “UI” — всё, что интегрировано в сайт

Названия не сильно важны, а вот распознавать эти две категории важно. Мы можем объединять все иконки в один спрайт (что будет рассмотрено во второй части), но никогда такого не сделаешь для изображений, используемых в статье.
Читать полностью »

Совсем недавно мы запустили Foundation for Apps. Было замечательно получать от вас отзывы и предложения по поводу нашего последнего фреймворка!

За это небольшое время мы уже успели узнать многое. Здесь первые 10 вещей, которые нам кажутся немаловажными:

1. Flexbox — это здорово, но сложно

Мы начали строить наш фреймворк с использованием Flexbox вместо традиционной сетки float. Это позволило нам аккуратнее выполнять некоторые вещи вроде смешения fixed- и fluid-width, существенно улучшить исходный код, и переориентировать сетку. Мы поняли, что Flexbox просто замечателен, и у него также есть поддержка множества разных браузеров. Пришлось разбираться во всех его тонкостях, делать его доступным для разного ПО, но у нас получилась просто замечательная сетка!
Читать полностью »

Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости

Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №146 (2 — 8 февраля 2015) - 1
Читать полностью »

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

Awesome-react

Традиционная «awesome» коллекция полезных ресурсов для завоевавшего сердца миллионов фреймворка React.js.

CSS Reference

Несколько интересностей и полезностей для веб-разработчика #38 - 1
Вероятно самый подробный справочник по CSS от авторов Codrops с их удивительными HTML/CSS/SVG реализациями. Помимо того, что данный перечень CSS описывает все самые новые свойства, псевдо-классы, функции, типы, правила, он также содержит информация по последним концептам от W3C.

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

Избавляемся от JavaScript в социальных кнопках (Facebook, VK, Twitter и др.) - 1
Как мы избавились от JavaScript-библиотек социальных сетей, ускорили скорость загрузки страниц и использовали RESTful API для “шаринга” и “лайков”.

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

Недавно мы рассказывали про морфинг форм в SVG, когда одна форма преобразуется в другую. А теперь давайте взглянем как формы могут перетекать друг в друга. Этот липкий тянучий амебный эффект многим знаком из видео c каплями ртути на поверхности.

image

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


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