jquery (23)

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

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

Codeguida · 27 December 2021 · 2

Відео на фоні з CoverVid

Зробіть поведінку вашого HTML5 відео як у фонового зображення з простим JQuery розширенням CoverVid. Дуже просте у використанні, просто виконайте наступні кілька кроків... Киньте_ covervid.min.js_ файл до вашої javascript теки та завантажте його післ...

Codeguida · 06 November 2021 · 1

Анімація без jQuery ч.1

Існує помилкове переконання серед web-розробників, що CSS-анімації - єдиний ефективний спосіб створення анімацій для web. Цей міф має примусив багатьох девелоперів відмовитися від JavaScript-анімацій. Це є великим недоліком, тому що: потрібно керув...

Codeguida · 2 роки тому · 2

Підбірка з 15 корисних jQuery плагінів

1\. stroll.js - CSS3 scroll effects Stroll.js є CSS3 плагіном для додавання ефектів до прокрутки, який працює на всіх браузерах з підтримкою CSS 3D transforms. 2\. jQuery Hex Colorpicker Hex Colorpicker - простий та легкий jQuery плагін, створений д...

Codeguida · 09 August 2021 · 1

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

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

Codeguida · 27 June 2021 · 3

jQuery для чайників ч.4 - функції

В першій статті, ми почали розглядати основи jQuery - типи даних і селектори; Далі, ми дізналися про події jQuery; В минулій статті, ми навчилися оброблювати помилки; Сьогодні, ми поговоримо про: Як запустити функцію; Як передати дані в функцію; Як...

Codeguida · 29 April 2021

Пишемо слайдер для порівняння зображень

При створенні сторінки товарів, існують деякі ефективні UX рішення, які можуть бути використані для того, щоб користувач міг "відчути" продукт. Слайдер для зрівняння зображень - одне із цих рішень. Якщо ви переглянете сторінку Sony Ultra HD TV, ви по...

Codeguida · 23 February 2021 · 2

jQuery для чайників ч.3 - обробка помилок

Вступна та минула стаття допомогли нам освоїти основи роботи з jQuery - ми розглянули типи даних, створення змінних, аспекти роботи з селекторами, також розібрали основні події: Click, Hover і ToggleClass. Сьогодні мова піде про: Нагалодження (дебаг...

Codeguida · 09 February 2021

Ajax без jQuery

Я, як і більшість, познайомився з jQuery задовго до того, як vanilla JavaScript. Я був впевнений, що базових знань jQuery буде достатньо для веб- дизайну. Але з часом я зрозумів важливість звичайного JavaScript. Коли я до цього прийшов, я повністю пе...

Codeguida · 04 February 2021

Використовуємо jQuery правильно

Завантаження з CDN Замість того, щоб зберігати jQuery на Вашому сервері, краще завантажувати бібліотеку з популярних CDN. Це дозволить зменшити час завантаження сторінки. <script src="/vendor/jquery/jquery.min.js"></script> <script src="//aj...

Codeguida · 13 January 2021

Що робить інтернет повільним: дослідження продуктивності JavaScript

Компанія CatchJS опублікувала дослідження про те, що може сповільнювати інтернет і які фактори та помилки з цим пов'язані. Дослідники опрацювали мільйон найпопулярніших сторінок в інтернеті та позначили кожну помилку і кожен URL. При цьому враховувал...

Codeguida · 30 December 2020

Як використовувати Device Orientation API

Сьогодні у нас є мобільні пристрої, які оснащені всім - від камер до геолокації. Ми маємо маленькі комп'ютери, що вміють робити майже все, що ми хочемо. Одним з ключових API для мобільних пристроїв є Device Orientation API. Device Orientation API доп...

Codeguida · 03 November 2020