基于HTML/Javascript的Metro风格盒子

Question

我想知道是否有任何可用的JS库，可以让我创建一个网页，其中的瓷砖/触摸面板可以像Windows 8 Metro / Modern UI面板一样工作（也可以根据可用页面空间布局盒子）。基本上想要在我的Web应用程序中制作类似Metro风格的菜单。

提前感谢你

- Matt

---

这是一个很好的问题，但不太适合在SO上讨论，因为没有一个正确的答案。 - Ruan Mendes

你可以使用http://metroui.org.ua/和code.google.com/p/jq-metro。 - Arpit Srivastava

Answer 1

是的，有一个称为MetroJS的优秀工具可以处理平铺动画。但是你需要自己管理它们在页面上的显示。 http://www.drewgreenwell.com/projects/metrojs

效果非常好！

我使用这个应用程序创建了我的应用Tweaker，并将其放在Windows Store中的社交类别中免费试用。所以它在Windows 8上也表现出色。

我有点失望的是VariableSizedWrapGrid控件在WinJS上不可用。如果你想要处理多种尺寸的图块并将它们紧密包装在一起，这就是你需要的控件，但不幸的是目前只能在XAML上使用。 http://blog.jerrynixon.com/2012/08/windows-8-beauty-tip-using.html

- Software Developer

Answer 2

我正在使用metroUI CSS（http://metroui.org.ua/windows8start.php），并且到目前为止很喜欢它。简单的HTML，由CSS样式化，具有许多功能，拖放js等。

- ss ulrey

---

这绝对是我的最爱，现在看到这个的任何人都应该使用MetroUI。 - Harry Mustoe-Playfair

请注意：这个程序不支持IE8（只支持9及以上版本），上面提到的基于js的解决方案（metrojs）可以在旧版浏览器上使用。因此，如果您需要遗留支持，请记住这一点。 - SeeMoreGain

Answer 3

通常情况下，您应该使用网格应用程序项目。使用第三方库，如MetroJS，意味着随着平台的进展，您将过时。

如果您曾经使用过Photoshop文件选择器，您就知道为什么这是不可取的。

- John Haugeland

Answer 4

如果你是Bootstrap的粉丝，那么BootMetro这个框架应该非常熟悉。

- Hadi Eskandari

Answer 5

我建议你试试 gridster.js。这是它的演示 http://gridster.net/。

- Kamal Reddy

Answer 6

我最近看到了这个，觉得非常棒：http://tholman.com/projects/tileJs/

使用HTML / CSS3来实现当您单击窗口时获取微妙旋转窗口效果。MetroJS和它可以结合使用以获得所需的效果。

让我知道你最终选择了什么，我计划自己也做一些类似的东西！

- Dr. Andrew Burnett-Thompson