html
(70)
Створення 3D логотипу за допомогою three.js
В цій статті, ми створимо 3D версію логотипу Treehouse використовуючи three.js. Нажміть та перетягуйте мишу для переміщення камери! Також ви можете використовувати колесо миші для масштабування. Демо Завантажити код 3D графіка може бути складною, осо...
Codeguida · 28 вересня 2020 · 14
VenoBox
Основною перевагою VenoBox є те, що він обчислює максимальну ширину зображення на екрані і зберігає його висоту, якщо воно вище вікна (в невеликих пристроях ви можете прокрутити вміст вниз, уникаючи мікроскопічного масштабування зображення). Використ...
Codeguida · 24 вересня 2020 · 2
Ефективність табуляції та пробілів в HTML
Як ви робите відступи у вашій розмітці? З допомогою табуляції чи пропуску? Невже це важливо для продуктивності? Давайте проведемо експеримент. Розглянемо сторінку, яка створює список з 50-ти предметів: <ul> @for (int i = 0; i < 50; i++)...
Codeguida · 30 серпня 2020 · 10
Маловідомі CSS-властивості
Існує багато CSS-властивостей, про які деякі дизайнери просто не знають. Або знають, але забувають використовувати ці властивості там, де вони здатні принести велику користь. Деякі з цих властивостей можуть допомогти відмовитися від використання Java...
Alex · 20 липня 2020 · 445
Зміна SVG іконок
Метод №1: сховати/показати SVG елемент Включаємо обидві іконки: <a class="expand-link" href="#0"> <svg class="icon icon-expand" viewBox="0 0 32 32"><use xlink:href="#icon-expand"></use></svg> <svg class="icon icon-contract" viewBox="0...
Codeguida · 15 липня 2020 · 41
Простий спосіб додавання CSS анімації до переходів між сторінками
Радий з вами поділитися цікавим та дуже простим jQuery плагіном Аnimsition. Animsition дає можливість додавати до посилань CSS анімацію при переході. Animsition має 18 різних анімацій: Зникнення `fade-in, fade-out, fade-in-up, fade-out-up, fade-in-do...
Codeguida · 03 червня 2020 · 52
Динамічні географічні карти з SVG і JQuery
Створюємо SVG мапу в Illustrator Створимо мапу Італії в Illustrator: Кожний регіон повинен малюватися як окремий об'єкт і мати свій власний рівень, з ім'ям, котре буде відповідати коду, використовуваному в базі даних, щоб ідентифікувати відповідні...
Codeguida · 14 травня 2020 · 10
Візуальний гід по Bootstrap 4
Що нового в новій версії Bootstrap Останнім часом було багато розмов про Bootstrap 4. Ось візуальне керівництво, яке покаже вам, що нового в BS 4 в порівнянні з попередньою версією. Панелі тепер Картки Те, що ви помітите в Bootstrap 4 перша за все,...
Codeguida · 4 роки тому · 4
Реагуючі блоки однакової висоти на основі Flexbox з JavaScript Fallback
Чому саме Flexbox? Тому що цей модуль був розроблений для того, щоб вирішити проблеми даного типу. Це гнучкий і ефективний спосіб управління для всіх видів макетів. Цей спосіб не створює майже ніякого часового розриву між правильним та неправильним в...
Codeguida · 4 роки тому · 55
Шапка, яка прилипає і автоматично приховується
Шапка, яка приєднується і автоматично приховується, - постріл, який вбиває відразу двох зайців: робить навігацію по сайту більш простою і доступною в будь-якому місці сторінки та зберігає робочий простір. Прилипання <header class="header" role="b...
Codeguida · 4 роки тому · 15
Спілкування в режимі реального часу
Socket.io \- це дійсно крута річ, вона дає вам можливість обмінюватися даними між клієнтами в режимі реального часу. Реалізуючи її разом з AngularJS, ви можете легко оновлювати вікно перегляду користувача. Перед тим, як заглибитись у код, давайте роз...
Codeguida · 25 березня 2020 · 16
Створення CSS3 нотатки без використання зображень
В цій статті ми розглянемо, як створити CSS стікер для нотаток без жодного зображення! Ось як це буде виглядати: В даному випадку я використав його для відображення цитати А. Ейнштейна. Ви можете використати інший текст. HTML Давайте поглянемо, на...
Codeguida · 18 березня 2020 · 18