Fireworks动态效果切图方法

在用Fireworks对图片进行切图时，只要我们设置一下，就能实现动态效果。下面我们就用实例来说明具体的操作过程。 内容来自dedecms

　　1.打开Fireworks，打开预先预备的文件“Zhou.gif”，点中绘图工具栏中的“SliceTool”。要在图像上制作用来调用JavaScript的热区，对图片进行切割，切出来的效果如图所示。

　　2.打开“Object”面板。先选中图里被选中的热区部分。“Object”面板立即将显示这个热区的属性，其中的链接地址默认为“NoURL(noHREF)”；“Alt”表示鼠标放到图片上时显示的提示；再下面那个红色的靶心是“target”，用来确定连接标签的目标，这里和DreamWeaver和FrontPage中的设置类似，我们选择“_Blank”；最要害的是：不要激活“target”下的“Auto-NameSlices”功能，而需手动给这个切割热区起一个名字，这样做是为了在指定动作时能够方便地辨认目标。还要注重的是在给“slice”命名时，不能使用中文，否则生成的JavaScript代码会在浏览器中长时间报错。在这个例子中我给屏幕热区起的名字是“hot”，再以同样的方法为图片最下面两个热区分别取名为“button1”和“button2”。

内容来自dedecms

　　3.接着做两个与“hot”热区相同大小的图片，做为切换的图片。然后回到我们刚才编辑的图像，选定button1热区，再选择Windows>Behaviors选项，打开“Behaviors”面板。按下“加号”按钮，在弹出的菜单中选择“SwapImage”，在随后弹出的对话框里的“SwapImageinSlice”选项中选择“Hot”热区，这样做就可以让button1热区调用一个使hot热区产生变化的JavaScript；在“SourceofSwap”中选择“ImageFile”，并在浏览面板中指定刚才制作的两个图像文件中的一个。最后激活“RestorImageonMouseOut”。激活这个功能后，浏览者将鼠标离开调用JavaScript的热区后，发生变化的图像将恢复正常。同样的方法，再让button2热区也调用一个使hot热区产生变化的JavaScript。

copyright dedecms

　　4.经过上面步骤以后，“Behaviors”面板将出现一个“OnMouseOver”的事件处理器，这就说明刚才做的热区已经成功调用了JavaScript。我们还可以将“OnMouseOver”事件处理器改变成“OnClick”，也就是将鼠标捕捉响应修改成鼠标点击响应。选择“File>PreviewinBrowser>Previewin就可以在浏览器中预览刚才的作品了。 dedecms.com

　　制作完成后，利用导出功能将刚才所制作的图像连同HTML一起输出。这样一个简单的动态效果的切图就彻底实现。只要把握其中的制作原理和方法同样可以应用到复杂的图象效果处理中。 dedecms.com

看完这篇，您有何感觉呢？