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

Манипулирование деревом DOM, это альфа и омега любого фронтенд-разработчика, а это не возможно без селекторов позволяющих находить HTML элементы. Давайте подробно разберёмся как они работают.

Основных методов селекторов в JavaScript всего 2 и оба они являются методами классов Document и Element:

  • querySelector() - принимает строку с селектором в качестве аргумента и возвращает первое совпадение с ним или null, если ничего не найдено.

  • querySelectorAll() - точно так-же принимает аргументом, строку с селектором и возвращает все найденные элементы, в виде массива элементов NodeListЧитать полностью »

Генерация PDF-документов это практически неотъемлемая часть при создании отчетов. Ведь гораздо проще иметь один HTML-шаблон который просто редактируется, и в нужные места подставить необходимые данные.

В статье отобрал самые популярные (по звездам на GitHub на момент написания статьи) инструменты для генерирования PDF из HTML, DOCX и некоторых других форматов. Рассмотрим только те, которые реализованы непосредственно на Go ИЛИ имеют обертки над API на Go.

Список следующий:

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

Начало

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

MomBoard: E-Ink дисплей для родственника с амнезией - 1


Моя матушка страдает амнезией, и примерно два года назад я поставил у неё дома E-Ink дисплей, чтобы упростить ей самостоятельную жизнь. В итоге этот дисплей прекрасно работает по сей день, и я решил поделиться основными моментами его настройки для тех, кому он может пригодиться в похожих ситуациях. Читать полностью »

Как заставить ИИ на базе LLM писать полноценные приложения на HTML + CSS + JavaScript - 1

Зачем вообще это делать?

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

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

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

▎Зачем нужен Long Press?

Long Press — это взаимодействие, при котором пользователь удерживает палец на экране или кнопку в течение определенного времени. Это может быть полезно для вызова дополнительных действий, таких как контекстное меню, всплывающие подсказки или специальные функции, которые не должны выполняться при обычном клике.

▎Стандартное решение

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

Преобразование растрового изображения в векторное изображение Tree.js и HTML (ознакомиться с полным кордом можно по ссылке на мой репозиторий )

Векторизация с помощью Three.js - 1
Векторизация с помощью Three.js - 2

Содержание

Пишем одностраничное приложение с помощью htmx - 1


JS-библиотеку htmx воспринимают как средство, которое спасает интернет от одностраничных приложений. Всё дело в том, что React поглотил разработчиков своей сложностью (так говорят), а htmx предлагает столь желанное спасение.Читать полностью »

DRY-фреймворк: продолжение - 1

Особая благодарность автору идеи @akopyl Его статья по теме.

Идея нехитрая, но очень заманчивая — пишешь CSS, пишется и CSS и HTML одновременно. Это ускорит и упростит разработку, да и реализовать несложно — HTML очень простой язык, по большому счётуЧитать полностью »

HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 10 - 1

Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке.

Сегодня мы рассмотрим следующие аспекты:

  • Почему в наших дизайн-системах и библиотеках есть сломанные нестандартные радиокнопки;
  • Мой способ отказаться от ссылки для изображения с сохранением интерактивности;
  • Дублирование стилей при наведении для фокуса вводит меня в ступор;
  • Можно ли скрыть кнопку с помощью атрибута disabled от скринридера.

Давайте начнём!

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


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