Fireworks制作不规则热区网页

2024-09-11 13:32:09

字体：大中小

来源：转载

供稿：网友

热区（hotspot）有时又称之为热点，是图像上带有超链接的一块区域，它可以呈矩形、圆形、甚至还可以是多边形。和文本超链接的情况一样，当浏览者将鼠标移动到热点上时，鼠标会变成手形。

　　文本和图像都可以在网页上创建超级链接。一般情况下一个图像只链接到一个目标。但是有时候一幅较大的图片上有不同的小区域，不同的小区域的图片要相应地链接到不同的目标上去，这样就需要利用到热区的功能。我们可以在这个大的图像上相应的部分绘制多个热区，然后将这些热区分别链接到不同的目标文件之中就可以上述目的。在浏览器中浏览时，鼠标放到热区时，鼠标变为手状，单击这些区域时会跳转到不同的链接页面上去。

　　下面我们以一幅图片来具体说明热区的概念。图1所示的是一幅天柱山风景名胜区的风光图片，在这幅图片上有太平塔、天柱山主峰、九井河、龙潭河、黑虎瀑以及天柱山门几个景点的小的图像。

　　如果还有这几个景点的详细介绍的html文件，那么我们就可以在这六张小图上绘制六个热点，然后分别将它们链接到有这几个景点详细介绍的页面上去。例如，我们将鼠标放置到太平塔的小图片上去，这时候鼠标能够变成手形，点击一下鼠标就跳转到了有太平塔景点详细资料的页面上去了。

　　下面我们具体讲一讲fireworks中热区的创建和使用方法。

图1 天柱山风光图

　　一、创建热区

　　我们就以上面的天柱山风景图为例来说明热区的创建过程。

　　（1）首先如图2所示在fireworks中打开图像。

图2 在fireworks中打开图像

　　（2）点击工具箱上的热点工具，我们会看见如图3所示的三类热区工具，rectangle hotspot tool“矩形热点”工具、circle hotspot tool “圆形热点”工具和polygon hotspot tool “多边形热点”工具。下面就分别讲讲这三类热区工具的使用。

图3 三类热区工具

　　* 矩形热点工具（rectangle hotspot tool）：用于绘制矩形热点区域。选中它后在图像适当位置按下鼠标左键拖动鼠标，即可绘制出矩形热区。如果同时按住shift键还可以绘制正方形热区，如图4所示。

图4 绘制矩形热区

图5 绘制多边形形热区

　　* 圆形热点工具（circle hotspot tool）：用于绘制一个圆形热区。选择它后在图像适当位置按下鼠标左键拖动鼠标，即可绘制出圆形热区。如果同时按住alt键还可以绘制以点击的点为中心绘制一个圆形的区域。

　　* 多边形热点工具（polygon hotspot tool）：用于绘制多边形热区。选择它后在图上多边形区域每个端点上单击可绘出一段段直线，所得的填充区域是多边形，如图5所示。

　　另外，我们还可以根据路径或者所选对象轮廓来生成热区。首先选中作为热区的路径或对象，然后选择“edit”菜单下的“insert”->“hotspot”就可以为其添加热区了。如果选择一个路径对象，那么这个对象区域就被定义为热区。

　　如果选择多个对象，如图6所示，我们选择天柱山风光图的六幅小图的边界路径，接着选择“edit”菜单下的“insert”->“hotspot”，这时候会跳出图7所示的对话框，我们选择“多重”按钮，这样就为所有的小图像添加上了热区了，如图8所示。

图6 选中六幅小图的边界路径