用Fireworks轻松制作网页交互按钮-2

[复制链接]
查看: 240|回复: 0
gggds 发表于 2009-12-27 12:03:35 | 显示全部楼层 |阅读模式
 6. 完成上步操作后,得到按钮的Up状态 (正常状态),如图5所示。! X5 {% W- z" B% o# m: Q

6 F- A1 Y+ c8 C2 E/ a3 n. j' k4 \5 G) ^1 `( ~3 O  R6 ]& S- W, k
$ {$ p3 M9 l- k5 n$ |% T
图5  7. 设计按钮的Over状态:按钮的Over状态是指在制作完成的网页中鼠标指针掠过按钮时显示的状态。单击按钮编辑器中的Over标签,按钮编辑器窗口的右下角增加了一个Copy Up Graphic(拷贝Up图像)按钮。单击该按钮,把Up状态的图像复制过来。此时,按钮的Up状态和Over状态相同。要使Over状态有别于Up状态,可以按照上述第4步的方法,改变按钮的填充特效。  8. 设计按钮的Down状态:按钮的Down状态是指在制作完成的网页中按下按钮时显示的状态。单击Down标签,按照上述第7步的方法,可以设计出与前两种状态不同的Down状态。  9. 为按钮建立链接:单击Active Area(激活区)标签,然后单击右下角的Link Wizard(链接向导)按钮,弹出Link Wizard对话框。单击Link(链接)标签,在对话框上部的文本框中输入URL,例如http://www.infosea.126.com,最后单击OK按钮。
$ |  ~7 f- g0 V. Y6 Z
! J" ]2 C' I1 f" m
  k9 g5 o5 V7 w$ n7 j& l8 f) `/ D6 a& o. s
图61 r4 l) C- Y6 g+ o
  10. 关闭按钮编辑器窗口,回到文档编辑窗口(图7)。& N  T8 P9 q% I6 j
6 E( N. w3 J" f9 a
4 R# t; K! {) P+ v0 J: F
- O; a0 H$ I: I. t" T
图7  11.单击Preview标签就可以预览交互按钮的效果。  12.输出HTML文档:从File(文件)菜单上选择Export(输出)命令,弹出Export对话框,在Base Name文本框中输入文件名,选定HTML文档的风格(Style)和存放位置(Location),单击保存按钮(图8)。9 [) _! R6 G8 z3 }4 ]1 P
& }2 T  b5 n0 Z& O1 A7 w9 C$ [

# d/ h9 |) u4 W/ N. V6 v# I2 b$ b: H
图8  13.用浏览器浏览生成的HTML文档,查看设计效果。  附注:①Dreamweaver 提供了直接插入或粘贴Fireworks 生成的HTML文档的功能;     ②通过按钮复制,改变按钮文本的方法,可以快速、高效地制作出一组外观一致只是文本不同的按钮。

本版积分规则

精彩图文

Copyright   ©2015-2016  展示网  Powered by©Discuz!  技术支持:凡尚展览     ( 粤ICP备14065977号 )