Изградете отзивчиви подреждащи се мрежови оформления с този скрипт

Персонализирани мрежи са едни от най-трудните функции за създаване от нулата. Можете да намерите изобилие от плъгини за зидария, но те всеки има свои собствени ограничения и изисквания.

Най- Сценарий на Муури е силна алтернатива за всеки, който има нужда сортируеми и отзивчиви решетъчни елементи с поддръжка на допир.

Тя е построена на Velocity.js за анимациите, заедно с Hammer.js библиотека за работа с мобилни устройства. Muuri не изискват jQuery, така че това е един от малкото ванилови JavaScript плъгини за мрежови интерфейси.

На главната страница на проекта ще намерите красива демо мрежа с всички функции. Анимационни ефекти, поддръжка на плъзгане и пускане и различни елементи на мрежата с различни размери. Тази демонстрация показва колко много контрол имате с мрежата на Muuri.

Можеш да избираш кои елементи да се показват, базирани на класове (т.е. филтриране), заедно с как искате да попълните празни пространства.

Стълбовете за зидария често оставят празни места, защото елементите на решетката не винаги пасват перфектно. Това е доста типично за по-големи сайтове като Pinterest. Въпреки това, можете добавете опции за плъзгане в мрежата до почти всеки потребителски контролиран интерфейс.

Мисля за социални профили с виджетни оформления и как биха работили. Или помислете списъци със задачи, изпълнявани като прогресивни уеб приложения на JavaScript. Всъщност има голяма демонстрация на тази страница в Muuri, която показва примерния списък със задачи и как може да работи като PWA в мобилния.

За да започнете, вие просто включва всички зависимости на JavaScript, заедно със скриптовете на Muuri. Можете да ги издърпате надолу през npm или да вземете копие от GitHub repo.

Тогава ти създайте елемент от мрежата на контейнера и да се насочите към това с ново копие на Muuri () метод. Всичко това е доста просто и особено лесно за използване, като копирате кодовите фрагменти от GitHub repo.

с пълна поддръжка за всички модерни браузъри (IE9 +) и интерфейс с възможност за докосване, този плъгин е един от най-добрите за характеристиките на влачене и спускане.

Научете повече, като прочетете началната страница на Muuri и се заемете с демонстрациите на живо. Това е чудесна система за динамични мрежи и е все още в активно развитие, така че можете да се доверите, че този плъгин ще бъде на разстояние за дълги разстояния.