如何在HTML中设置十六进制的链接网格?

时间:2012-02-01 19:17:04

标签: html

我开展了由许多小世界组成的D& D广告系列,每个活动都触及其他6个,如同十六进制网格。事实上,我的(邋)手绘地图是在六角网格打印输出上完成的。

我想做的是制作一个索引页面,每个小世界都有自己的html页面。

我正在试图弄清楚如何使该索引页面上的链接保持十六进制网格布局。

我想我可以用CSS完成所有操作,但这似乎相当繁琐,因为我有大约300个不同的六角形世界。

有关如何加快流程的任何想法?我现在能想到的最好的就是拥有一个通用的Javascript函数,当它被加载到页面时,每个十六进制都会调用它,这会将它定位在正确的位置。

2 个答案:

答案 0 :(得分:0)

使用maparea元素尝试此操作。您可以使用poly作为形状,并按此方式执行。

http://www.w3schools.com/tags/tag_area.asp

http://www.w3schools.com/tags/tag_map.asp

答案 1 :(得分:0)

这里只是猜测,但我敢打赌你可以使用CSS变换在你的中心点周围连续进行6次60度旋转。

概念证明:http://jsfiddle.net/FMpc9/

(注意:需要一个webkit浏览器,应该很容易更新到Moz。)