Metro JS - интересный JavaScript плагин для создания живых плиток как в Windows 8
![Metro JS - интересный JavaScript плагин для создания живых плиток как в Windows 8](/uploads/posts/2016-01/1454163086_387beedb0d330b5886e35511da526a27.png)
Операционная система Windows 8, со своим появлением, принесла новый вид интерфейса в Metro стиле и живые плитки, подобный дизайнерский ход перешел и в веб. Metro JS - это JQuery плагин, при помощи него можно реализовать подобный дизайнерский ход на своем сайте.
Плагин совместим практически со всеми браузерами, начиная от IE7. В него входят два файла с расширением JS и CSS, а также их мини версии, с немного урезанным функционалом. Эти файлы нужно загрузить в директорию вашего сайта, после загрузки можно добавлять блоки на страницы сайта, используя HTML код. Примеры кода находятся на сайте разработчика.
Metro JS позволяет встроить в сайт квадратные или прямоугольные блоки разных размеров, с различной анимацией смены изображения и всей палитрой цветов из живых плиток Windows. При этом можно воспользоваться как онлайн генератором для их создания, так и менять их с помощью кода.
$(".live-tile").liveTile({ swap:'html,image', frontContent: ['some html content', 'i dont want random>'], frontIsRandom: false, frontImages: [ {src: 'img1.gif', alt:'some images'}, // note: you can also pass attr and css values directly for images { attr: { src:'img2.gif', alt:'i want random' } } ], imgSwap: { frontIsRandom: true } });
Онлайн генератор позволяет выбрать размер плиток, цвет, а также отступ друг от друга. Сгенерированным текстом нужно будет заменить содержимое CSS файла плагина. Для редактирования плиток с помощью кода, всё же понадобится обладать некоторыми знаниями CSS.
Скачать:
Комментариев 1