Домашняя » Веб-дизайн » Свежие ресурсы для веб-дизайнеров и разработчиков (июнь 2015 г.)

    Свежие ресурсы для веб-дизайнеров и разработчиков (июнь 2015 г.)

    Можете ли вы поверить, что эта серия работает уже почти 3 года? За это короткое время мы представили не менее 30 списков самых свежих ресурсов для веб-дизайнеров и разработчиков. И мы собираемся продолжать это с новой компиляцией на июнь.

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

    Давайте проверим их.

    Средний стиль подтверждения

    Medium получил высокую оценку за свой дизайн; макет и пользовательский интерфейс, кажется, были тщательно продуманы. Кроме того, он также вдохновляет веб-разработчиков на разработку библиотек JavaScript или CSS для репликации пользовательского интерфейса. Medium Style Confirm - это одна библиотека JavaScript, которая напоминает всплывающее окно или диалоговое окно в Medium..

    пингвин

    Penguin - это новый интерфейс, который вы можете использовать в качестве основы для своих сайтов. С такими инструментами, как Grunt и Sass, вы можете легко добавлять или удалять библиотеки или CSS, которые вам не нужны, из фреймворка, делая его максимально легким. Это также хорошая альтернатива для Bootstrap и Foundation.

    Elevator.js

    Вы видели эту кнопку на веб-сайте, который позволяет вам скользить вверх по верху страницы? Большинство кнопок просто поднимают вас наверх, но с Elevator.js вы получаете эффект ускорения скольжения, похожий на лифт, музыку и “звенеть!” звук, как только вы достигли верхнего этажа. Действительно мило!

    X-Instagram

    X-Instagram - это пользовательский элемент Polymer, который тянет и показывает изображения из Instagram по тегам. Этот элемент делает весь процесс намного проще. Мы просто добавляем элемент, как обычный элемент HTML, и указываем ключевое слово tag в качестве атрибутов элемента..

      

    И пусть магия начнется!

    CamanJS

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

    ClusterizeJS

    Clusterize.js - это библиотека JavaScript, которая повышает производительность при работе с большим количеством данных в таблицах. Когда вы прокручиваете таблицу с, скажем, 5000 в списке, обычно опыт становится медленным и прерывистым. Эти библиотеки JavaScript решат эту проблему, сделав прокрутку плавной.

    Сядьте тест

    Сядьте тест это набор вопросов для оценки ваших навыков и знаний по CSS3, HTML5 и JavaScript. Каждому тесту дается ряд вопросов и ограниченное время для выполнения всех этих вопросов. Это хороший источник, чтобы узнать, насколько мы хороши с этими языками.

    HTML-стрелки

    Это коллекция специальных нативных символов Unicode, которые вы можете встраивать в HTML и CSS. Эти символы включают стрелки, валюту и пунктуацию. Вы обнаружите, что иногда вам не нужен значок шрифта для отображения этих символов.

    Flickity

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

    Typeslab

    Typeslab - это удобный инструмент для создания постеров в виде плиты. Просто напишите содержание и выберите шрифт, Typeslab мгновенно создаст плакат. Затем вы можете скачать его или опубликовать в Imgur.

    MatchMedia

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

    Ниже приведен пример, используемый для запуска сценария с размером окна 320px и ниже:

     if (matchMedia ('только экран и (max-width: 320px)'). соответствия)  

    Sass Burger

    Sass Burger поставляется с Mixin, который позволяет вам создавать “Гамбургер” значок и превратить его в крестик с меньшими хлопотами.

    Маркс

    Marx - это набор правил стилей CSS, чтобы сделать стили элементов более согласованными. Это настраиваемый (с Sass), легкий и работает из коробки. Хорошая альтернатива уже популярным инструментам сброса CSS, таким как Normalize.css.

    CSS.js

    CSS.js используется для разбора CSS-файлов для объявления стиля. Библиотека изначально использовалась для команды в Jotform для создания WYSIWYG-опыта для редактирования форм с помощью CSS. Теперь они открыли его для всех нас. Стоит сэкономить, на случай, если вам понадобится позже.