Плитка в стиле современного пользовательского интерфейса (Metro) в HTML 5?

Я хотел бы знать, возможно ли воссоздать систему плиток современного пользовательского интерфейса из Windows 8 на HTML-странице.

Я уже создал это из этот сайт. Вот код

<div class="tile pos1-1 w1h1 techolive"></div>
<div class="tile pos1-2 w1h1 techblue"></div>
<div class="tile pos2-2 w1h1 techred"></div>
<div class="tilebanner" style="font-size: 20px !important;">
    <a class="tile pos2-3 w2h1 techdarkblue" href="...">
                    List of<br/>
                    Sessions
    </a>
</div>

Теперь я хотел бы добавить тот же эффект слайд-движения, что и в современном пользовательском интерфейсе. Я гость, мне нужен javaScript, чтобы создать это. Возможно, эта или аналогичная функция включена в HTML 5 или CSS. Вы не знаете, где я могу найти образец?


person Bastien Vandamme    schedule 24.04.2013    source источник
comment
Я только что нашел это, но это инструмент, а не настоящий код. Я хотел бы закодировать это для создания веб-сайта: youtube.com/watch?v=5MB4PqHhEbU   -  person Bastien Vandamme    schedule 24.04.2013


Ответы (2)


Существует плагин для jQuery под названием Metro JS. Возможно, вы можете использовать это для создания плиток с помощью jquery и javascript.

person Jan Hommes    schedule 24.04.2013
comment
@ Дэвид Чейз: Ты прав. Я использовал немецкую грамматику. Исправил мой ответ. - person Jan Hommes; 24.04.2013
comment
лол, я имею в виду, как Apple говорит приложение для этого, я говорю, что есть плагин для этого, ничего общего с вашим грамматиком :) - person David Chase; 24.04.2013

Любой, кто просматривает это сейчас, должен проверить MetroUI — он следует методологии, очень похожей на Twitter Bootstrap, и очень прост в использовании. использовать и дает действительно хорошие результаты.

Это также:

Разработано по рекомендации Microsoft для создания пользовательского интерфейса.

Таким образом, вы получаете что-то действительно похожее на Windows 8.

person Harry Mustoe-Playfair    schedule 26.07.2013