使用DW工具给图片添加热点.docx
《使用DW工具给图片添加热点.docx》由会员分享，可在线阅读，更多相关《使用DW工具给图片添加热点.docx（6页珍藏版）》请在冰豆网上搜索。
使用DW工具给图片添加热点
如何使用DW工具给图片添加热占
八\、
作者:
日期:
如何使用DW工具给图片添加热点
、准备一张图片
准备一张需要给不同区域添加不同热点的图片
、插入图片:
打开Dreamweaver，新建一个网页，将图片插入到页面中。
fl
t
找到地图工具
单击鼠标左键点击图片
这时候软件下方的属性面板就会变成和图片相关的
P
354
是地图工具属性隐藏了
可以点击属性
rc
站I巾■■fePilbrij
属性
注意看左下角部分
如图
注：
如果没有上图显示的热点地图工具
酚，IZSL贡加
J
融I
中的红色框内所示。
I坨些di#,
泄Mlk二匕鼻Li^Th
r讣；a
:
—塔r
豐-芒…:
?
.二一r>."■r：
2rJki孑…e」
巨I穀：
孑'
创鬧0
i誓自ii护卩
冃标|印
i沖⑹
2y■£
[il
3DV水平迦盹）
⑨o对^⑷［點
游3
面板右侧的三角符号打开，如下图:
T=
Q1°°嗚“133白乂GDD”4BS玄』闔秒丫血匸.鼻
四、绘制热点:
注意方块、圆形、多边形三个小图标，它们就是我们要用的“图片热点”工具，不同的热点工具可以绘制出不同形状的热点区域。
先点击方块按钮，将鼠标移动到图片上，这时候鼠标就变成了十字，在你想加链接的地方画一个方块。
添加热点后的图片区域会出现一个浅蓝色蒙版，意味
着该区域已经添加了热点。
依次添加其他区域的热点
五、给热点添加链接:
热点区域画好后，下面的属性面板就会变成该热点区域的属性，如下图:
------
"-
L-
d
Li一
-12
filft（L）ktIp：
Hw.K£yLtil
a3.
iHSIThp
吐口0匕
“链接”就是点击此处跳转的链接地址;
目标”就是点击此处时窗口的打开方式;
“替换”就是鼠标悬浮在该区域时提示的文字。
一般使用"blank"，指超链接将在新窗口打开。
注：
可以采用画一个区域，添加对应的连接，也可以依次把所有的区域热点画完,
然后点击热点区域，依次添加对应的连接。
初学者建议一个一个的添加。
六、修改热点：
对热点区域进行拖动或者局部调整
如果需要修改热点区域，或者需要进行微调，如中国地图添加热点，不可能把所有的热点区域都做到刚好覆盖对应的区域，那就需要对已经添加热点的区域进行调整。
点击热点区域，热点区域四周会出现浅蓝色的点。
光标放在浅蓝色的点，点击鼠标左键，即可调整热点区域的大小。
七、对个图片添加热点:
如果一个页面中有多个图片需要添加热点，那么久需要给每一张图片对应的热点设置不同的热点名称，如图示，地图（M）处的文本框中的字符就是当前热点的名称。
可以使用mapl、map2、map3。
。
。
也可以使用不同图片的内容对热点进
行命名，如top_map,foot_map,act_map。
。
。
总之，不同图片的热点名称不同即可。
42&K贲加667
:
頂交件㈤^20i4041^1^3207.
3ID
«（K）
無摟OJ
G1漏辑z■/
|Has酚巫
目咏血
—湘⑻P—1E*
（11
侖_j対弁⑹酗道
八、热点的原理
图片通过usemap="#Map"属性将名称为"Map"的热点区域及连接映射
到图片上。
热点添加完毕后，查看页面源代码，你会发现在代码最底下多出几行内容,
这些就是热点生成的：
vimgsrc="1.png"width="667"height="354"
border="0"usemap="#Map"/>
v/map>
一般来说，图片的usermap属性对应的是map热点的name的属性值。
所以如果页面中如果有多个图片添加热点，那么每一个图片的usemap值跟对应的
热点地图的name值一定要一样，且不同的热点区域name值不可以相同，如果相同，那么图片上的热点区域将会以相同名称的第一个热点区域为准。
crap厂
^/map>
naiE&=,rKapiJ
3hape="rect"3hape="r&ct"shape-"!
eat'"gtiane="r&CD"
Goords=-1,-1F210F352,'href^#'1/>0£50113="215,2,66411£0"11匸乜fhh/>caards-'S17,107,550,355"href-ptp/>coard3=wS#1£«#«65f350"h胆"寫片/>
3rc="l-png"width="667"h.eigh.t="354"bard亡^="0"usemap="+Map2r,
3tiape='*paly*"shape="poly*
□0^;13-="217,-3,4S7,ISO1"href-"4T,taraeT-^blank"/>coards-_674,190"href-"#"^Arget^'Jalank"/>co&ris^*fi7SfL77w上1上亡±="#"tfirget^h_blank*/>
经验内容仅供参考，如果您需解决具体问题（尤其法律、医学等领域），建议您详细咨询相关领域专业
升级会员 