如何进行对角网格布局？

Question

我想为项目库开发对角网格布局。我找到了一个类似我需要的项目 - http://neolab.no/。

这是我必须做的布局。 http://felipefernandes.nu/beta/fsmohan/screenshot/Wireframe_Site_FSMohan-05.jpg

有什么想法吗？

Answer 1

你有一些选择，但没有一个是非常好的：

• 查看图片：这样看起来不错，但是你的悬停会很困难，因为它们会基于矩形。
• 使用图像地图：您的悬停区域将能够正确排列，但效果会很困难。
• CSS3转换：如果你只能处理IE9 +，这可能是一个选择。你必须顺时针旋转保存图像，然后通过CSS逆时针旋转它们（反之亦然）。这是a quick example。
• 使用<canvas>
• 使用Flash：对于功能和外观来说，这可能是你最好的选择，但强迫你的网站依赖插件有一个问题的世界。