Свіжі ресурси для веб-дизайнерів і розробників (червень 2015 р.)
Чи можете ви повірити, що ця серія працює вже майже 3 роки? За цей короткий час ми представили принаймні 30 списків найсвіжіших ресурсів для веб-дизайнерів і розробників. І ми збираємося продовжувати це з новою компіляцією на червень.
У цій компіляції ми розглянемо декілька бібліотек JavaScript для показу повзунків, більш плавного прокручування таблиць даних, прохолодний ефект ліфта для кнопки прокручування вгору та багато іншого..
Давайте перевіримо їх.
Підтвердити середній стиль
Середній був похвалив за його дизайн; макет і користувальницький інтерфейс, здається, ретельно продумані. Крім того, він також надихає веб-розробників на розробку бібліотек JavaScript або CSS для реплікації інтерфейсу користувача. Середній стиль Підтвердження - це одна бібліотека JavaScript, яка нагадує спливаюче вікно або діалогове вікно в Medium.
Пінгвін
Penguin - це новий фронтальний фреймворк, який можна використовувати як основу своїх веб-сайтів. За допомогою таких інструментів, як Grunt і Sass, ви можете легко додавати або видаляти бібліотеки або CSS, які вам не потрібні поза рамками, що робить їх максимально легкими. Це також гарна альтернатива для Bootstrap і Foundation.
Elevator.js
Чи бачили ви цю кнопку на веб-сайті, що дозволяє пересуватися вгору сторінки? Більшість кнопок просто приведе вас до вершини, але за допомогою Elevator.js ви отримуєте ефект ковзання, подібний до елеватора, музики та “Ding!” звук, як тільки ви досягнете верхнього поверху. Дійсно приємно!
X-Instagram
X-Instagram - це полімерний користувальницький елемент, який тягне і показує зображення з Instagram за допомогою тегів. Цей елемент значно полегшує весь процес. Ми просто додаємо елемент, як звичайний елемент HTML, і вказуємо ключове слово тега як атрибути елемента.
І нехай починається магія!
CamanJS
CamanJS є великою бібліотекою JavaScript для маніпулювання зображеннями. Він поставляється з набором функцій, які ви часто знаходите в редакторі зображень. Можна перетворити розмиття зображення, чорне та біле, і навіть збільшити контрастність.
ClusterizeJS
Clusterize.js - це бібліотека JavaScript, яка збільшить продуктивність при роботі з великою кількістю даних у таблицях. Як ви прокручуєте вниз таблицю з, скажімо, 5000 у списку, звичайно досвід перетвориться laggy та jerky. Ця бібліотека JavaScript буде вирішувати цю проблему, роблячи дії з прокруткою плавним плаванням на всьому шляху.
Пройдіть тест
Пройдіть тест - це набір питань для оцінки ваших навичок і знань щодо CSS3, HTML5 і JavaScript. Кожному тесту дається ряд питань і обмежений час для завершення всіх цих питань. Це хороший джерело для того, щоб дізнатися, наскільки добре ми справді з цими мовами.
Стрілки HTML
Це набір спеціальних символів Unicode, які можна вбудувати в HTML і CSS. Ці символи включають стрілки, валюту та пунктуацію. Ви побачите, що іноді вам не потрібна піктограма шрифту для відображення цих символів.
Flickity
Flickity - це бібліотека JavaScript для показу каруселей, галерей або повзунків на вашому веб-сайті. Він оптимізований для сенсорного екрану; Ви можете легко ковзати каруселі пальцем або трекпад, якщо ви знаходитесь на ноутбуці. Він також поставляється з купою варіантів, що дозволяють повну настройку будь-яким способом вам подобається.
Typeslab
Typeslab є зручним інструментом для створення плаката типу Slab. Просто напишіть вміст і виберіть шрифт, Typeslab генеруватиме плакат миттєво. Потім ви можете завантажити його або опублікувати в Imgur.
MatchMedia
Matchmedia - це бібліотека, яка копіює CSS-запити. Бібліотека насправді не така свіжа, але це дійсно корисна бібліотека, яку я вирішив поставити в список. Якщо вам потрібно виконати сценарії на основі розміру вікна перегляду користувача або типу медіафайлів, це потрібна бібліотека.
Нижче наведено приклад, який використовується для запуску скрипта розміром 320 пікселів і нижче:
if (matchMedia ("лише екран і (max-width: 320px)").))) 
Sass Burger
Sass Burger поставляється з Mixin, що дозволяє створювати “Гамбургер” і перетворити його на перехресну позначку з меншими труднощами.
Маркс
Маркс - це набір правил стилів CSS, щоб зробити стилі елементів більш послідовними. Він настроюється (з Sass), легкий і працює з коробки. Хороша альтернатива вже популярним інструментам скидання CSS, як Normalize.css.
CSS.js
CSS.js використовується для розбору CSS-файлів для декларування стилів. Спочатку бібліотека використовувалася для команди Jotform для створення досвіду WYSIWYG для редагування форм за допомогою CSS. Тепер вони відкриті для того, щоб ми всі використовували. Варто заощадити, на всякий випадок, якщо вам знадобиться пізніше.
