trimmings
1.0.0
Что происходит с вашим процессом веб -разработки, когда вы можете сосредоточиться на разработке представлений и перестать думать о том, как их сшивать? Trimmings от Postlight-это библиотека JavaScript с нулевой конфигурацией, которая добавляет слой плавного и быстрого взаимодействия на страницах на ваши веб-страницы. Все, что вам нужно сделать, это добавить некоторые подсказки к HTML, который у вас уже есть.
Узнайте больше об этом в нашем знакомстве с отделками.
Этот проект следует по стопам библиотек, таких как Turbolinks и стимул. Он считает, что лучшее место для вашего бизнеса и логики рендеринга находится на сервере, что вы должны отправить HTML своим пользователям, и что JavaScript лучше всего подходит для манипуляций с DOM с постепенно усиливаемым. Trimmings-это набор шаблонов, которые позволяют вам добавлять манипуляции с DOM в ваше приложение, добавляя атрибуты data-trimmings-* в ваши интерактивные элементы. Меньше JavaScript в вашем проекте означает меньший риск.
После того, как вы создали свой веб -сайт, и он обслуживает HTML, который представлен так, как вам это нравится, вы можете начать добавлять подсказки, которые улучшат то, как ведут себя ваши взаимодействия.
Возможно, у вас есть ссылка на детальную страницу, которую вы хотели бы открыть в модале. У автономной страницы, вероятно, есть заголовок и нижний колонтитул, который вы не захотите ждать в своем модале. Это не проблема. Просто добавьте inline намек на вашу ссылку:
<a data-trimmings-inline="from: .detail-container, to: .modal-container" href="/photos/2">
View as a modal
</a>
Если ваш посетитель нажимает на эту ссылку, страница будет извлечена в фоновое значение, элемент с классом detail-container будет извлечен из результата, и он будет вставлен в элемент с классом modal-container , который уже находится на странице. Вы можете написать CSS, который заставит это отображаться, как вам нравится. Теперь у вас есть модал! Это все, что нужно!
Просто включите trimmings.js в свой <head> . Вот и все. Тримины автоматически активируются, когда загружается ваша страница - не нужно думать о жизненном цикле.
<script src="/trimmings.js"></script>
Функции Trimmings включены в конкретные элементы путем добавления атрибутов data-trimmings-* . Для получения более подробной информации об использовании каждой функции Trimmings, пожалуйста, проконсультируйтесь с руководством по Tremmings.
Лицензирован под одним из
на вашем варианте.
Если вы нашли ошибку или хотите предложить новую функцию, отправьте проблему и давайте поговорим об этом!
Мы ожидаем, что все участники Trimmings будут соблюдать наш кодекс поведения.
Если вы явно не заявляете иное, какой-либо вклад, преднамеренно предназначенный для включения в работу вами, как определено в лицензии Apache-2.0, должен быть двойной лицензией, как указано выше, без каких-либо дополнительных условий или условий.
? Проект лабораторий от ваших друзей на Postlight. Счастливого кодирования!
