在网页中创建几个触发事件的点，如何很快的放置它们的位置？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 4861 天前的主题，其中的信息可能已经有所发展或是发生改变。

http://imgur.com/QdyKH

例子页面： http://hot.slsp.net/

页面中在笔记本附近有几个可以触发事件的点，在实际开发中用什么工具能在一张图片中创建这样的点？

页面

触发

创建

12 条回复 • 1970-01-01 08:00:00 +08:00

bcxx

2012-07-09 09:21:19 +08:00

map area?

lingyired

2012-07-09 09:28:57 +08:00

@bcxx 我看到的这个例子不是map area 的。。实际的webapp 是怎么弄这些点的？

bcxx

2012-07-09 09:56:36 +08:00

逐个逐个量出来……[猜的] 因为把其中一个 tip 的 margin 去掉之后就都乱了……应该不是插件生成的，而 tooltip 就是插件生成的……

lingyired

2012-07-09 09:59:57 +08:00

@bcxx 逐个量出来啊。。。如果最后没办法只能这样做了

sxd

2012-07-09 13:10:13 +08:00

记得很久以前用firewoks 有个 hotspot

NemoAlex

2012-07-09 13:27:56 +08:00

才十个而已，工具使用得当的话五分钟就搞定了

TheC

2012-07-09 13:31:28 +08:00

dw画map很方便的

lingyired

2012-07-09 14:00:05 +08:00

@sxd 我去找找看

lingyired

2012-07-09 14:00:18 +08:00

@NemoAlex 那是什么工具呢？

lingyired

2012-07-09 14:00:58 +08:00

@TheC 看来只能Wine 一个来试试了，我一般写代码都是用SciTE 的

NemoAlex

2012-07-09 14:14:56 +08:00

@lingyired Chrome Developer Tools 或者 Firebug 之类的
代码里先写好元素和一些 CSS 样式，比如 position: absolute; left: 0; top:0;
然后在 Developer Tools 改 left 和 top 的值，对上去了以后填到代码里
Tip: 填写数字的时候，键盘上下可以加减1像素，shift+上下可以加减10像素

lingyired

2012-07-09 14:21:40 +08:00

@NemoAlex 恩，我原本就是打算这样慢慢试。