html (70)

Створюємо власний блог з допомогою Parse.js, частина 3

В попередній статті ви дізналися як додати дані на Parse.com і відобразити їх на вашому сайті. Ви познайомилися з поняттям об'єкт, колекція та екземпляр, і створили свій перший клас. Починаючи з цього уроку, ми будемо створювати в адмін-панель блогу....

Codeguida · 30 грудня 2021 · 11

Динамічні географічні карти з SVG і JQuery

Створюємо SVG мапу в Illustrator Створимо мапу Італії в Illustrator: Кожний регіон повинен малюватися як окремий об'єкт і мати свій власний рівень, з ім'ям, котре буде відповідати коду, використовуваному в базі даних, щоб ідентифікувати відповідні...

Codeguida · 4 роки тому · 14

Адаптивне меню з допомогою CSS3 та jQuery

В цьому уроці ми створимо адаптивне меню за допомогою CSS3 і JQuery. Ось як це виглядатиме (перейдіть на Codepen та пограйтеся з шириною сторінки): {full-post-img} HTML Ми обертаємо все в nav елемент з класом nav-bar. Далі створюємо div з класом nav...

Codeguida · 27 грудня 2021 · 24

Гід по оптимізації веб-сторінок та додатків

Коли справа доходить до продуктивності, ми не маємо права примушувати користувачів чекати і залишити веб-сторінку з негативними враженнями. Оптимізація є основою професійного створення сайту. Що визначає швидкість сторінки? Можна виділити наступні пу...

Codeguida · 27 червня 2021 · 38

Реагуючі блоки однакової висоти на основі Flexbox з JavaScript Fallback

Чому саме Flexbox? Тому що цей модуль був розроблений для того, щоб вирішити проблеми даного типу. Це гнучкий і ефективний спосіб управління для всіх видів макетів. Цей спосіб не створює майже ніякого часового розриву між правильним та неправильним в...

Codeguida · 25 квітня 2020 · 57

Створюємо власний блог з допомогою Parse.js, частина 1

Ви коли-небудь стикалися з ситуацією, коли ви маєте ідею для веб-ресурсу, але не знаєте як її можна реалізувати? З Parse.js кожен, хто осягнув ази HTML, CSS і JavaScript може створити динамічний веб-сайт або web- додаток з легкістю. У цьому уроці ро...

Codeguida · 27 листопада 2020 · 7

Досить зловживати div: інтро до семантичного HTML

div проявив себе Усі ми любимо тег div. Він існує вже давно і за цей час став найпопулярнішим елементом для огортання будь-якого контенту в блок, щоб стилізувати чи структурувати його. Навіть зараз у продакшені часто можна натрапити на подібний код:...

Codeguida · 15 квітня 2019 · 62

Інтро до Веб-компонентів

Фронтенд-розробка розвивається з шаленою швидкістю. Варто лише поглянути на численні статті, туторіали та треди у Twitter зі скаргами на технології, колись такі прості та зрозумілі. У цій статті ми з'ясуємо, чому для якісного користувацького досвіду...

Codeguida · 24 квітня 2019 · 28

Інклюзивні компоненти: картки

Деякі з компонентів, які розглядаються в блозі Хейдона Пікерінґа, мають задокументовані рекомендації для коректної роботи. Наприклад, стандарт WAI-ARIA передбачає певну структуру і поведінку для вкладок. Наскільки точно слідувати цим рекомендаціям —...

Codeguida · 26 лютого 2020 · 45

Як перетворити ваш сайт в мобільний застосунок: знайомство з PWA

Ви, напевно, чули про Progressive Web Apps (PWA). Але в цій статті я не буду описувати тонкощі роботи та зазирати під капот. Лише нагадаю, що PWA — це сайти, що можна додати на домашній екран смартфона і вони будуть працювати без інтернету. Натомість...

Codeguida · 03 серпня 2017 · 21

Створення 3D логотипу за допомогою three.js

В цій статті, ми створимо 3D версію логотипу Treehouse використовуючи three.js. Нажміть та перетягуйте мишу для переміщення камери! Також ви можете використовувати колесо миші для масштабування. Демо Завантажити код 3D графіка може бути складною, осо...

Codeguida · 28 вересня 2020 · 15

VenoBox

Основною перевагою VenoBox є те, що він обчислює максимальну ширину зображення на екрані і зберігає його висоту, якщо воно вище вікна (в невеликих пристроях ви можете прокрутити вміст вниз, уникаючи мікроскопічного масштабування зображення). Використ...

Codeguida · 24 вересня 2020 · 2