Metro JS - интересный JavaScript плагин для создания живых плиток как в Windows 8
Операционная система 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