IE4Gadget──网页动画百宝箱

刘雄伟 
2001年 34期

　　CutePage IE4Gadget 1．0是一个完全免费的网页DHTML动画效果制作工具。
　　　　1．在CutePage2．0安装完成后，点击“开始/程序/SourceTec/CutePage 2．0 中文专业版/ CutePage IE4Gadget 1．0”启动IE4Gadget编辑主界面（^34040702a^1）。
　　　　2．点击“新建组件”按钮，在“组件名”输入框中键入欲创建的组件名称，默认为“Normal”，在“描述”栏中输入对当前组件的说明文字，然后“选择模板”列表框中选择DHTML动画模板（共有10种），所选择的每一种下面有文字说明。
　　　　3．根据不同的选择，随即出现的参数设置对话框也不同，我们以制作日历为例，^34040702b^2所示即是选择日历（Calender）后出现的参数设置窗口。此窗口从上到下可分为6个部分，依次为：“选择日历在浏览器中显示的位置和要显示的问候语文字”；“当前时间显示框属性”用于设置时间显示框的宽度和高度；“颜色属性”用于设置背景色、当前日期颜色、问候语、日历标题、时间框文本和日期颜色；“字体属性”用于设置日历中要显示的所有字体的不同属性。“边框样式”用于设置月历边框和日期区域边框的属性；最后的“指定calander2．js服务器路径”用于指定calendar2．js在服务器的路径。设置好参数后，点击“确定”按钮回到编辑主界面。
　　　　4．现在日历的DHTML组件已经创建。这时点击工具栏最左边的“保存”按钮，打开“保存为”对话框，输入文件名点击“保存”即可将刚才创建的组件保存下来。如果希望把已经配置好的组件以模板形式保存，则点击工具栏上的“存为模板”打开“存为模板”对话框，在“模板名”输入框中输入模板名，然后点击“确定”按钮即可。
　　　　5．编辑修改组件：如果在创建组件后，希望再重新修改设置的参数，则可以直接点击主界面中的“配置”按钮重新打开属性设置对话框进行参数设置。如果当前组件已经保存，并且不是当前打开的组件，则可以通过“打开”按钮打开组件，直接进入属性设置对话框进行配置，配置完后点击“确定”按钮即可回到主界面，重新保存即可。
　　　　6．最后一步，也是最关键的一步，就是要将创建的动态DHTML组件插入到网页中。可通过以下方法实现：
　　　　1）复制代码：直接点击工具栏上的“资源文件”按钮打开“资源文件”对话框，点击“复制到”按钮，打开“目标目录选择对话框”，选择目标文件夹，点击“确定”按钮即可将列出的资源文件复制到目标文件夹。然后单击主界面中的“复制代码”按钮，打开“DHTML组件的HTML代码”显示框，系统将自动拷贝下这些代码至系统的剪贴板中，关闭代码显示框。这时再利用网页编辑器或记事本打开须插入组件的网页，在其代码窗口中确定好放置该代码的位置，直接将代码粘贴到该网页的代码编辑窗口中即可。值得注意的是，如果你在HTML代码中指定了资源文件的路径，就必须将所有资源文件拷贝到HTML代码中所指定的目录中去，若未指定目录，就拷贝到与HTML文件相同目录下即可。
　　　　2）新建页面：在主界面中直接点击“新建页面”按钮，打开“另存为”对话框，输入文件名，点击“保存”按钮创建一个新的HTML文件。同时资源文件也将自动地复制到创建的网页文件的同一目录下，此文件中就包含了你所制作的组件的代码，并能正常显示了。
　　　　3）插入：点击“插入”按钮，出现“打开”文件对话框，选择欲插入当前DMTML动画组件的网页文件，点击“打开”按钮，出现“插入DHTML组件到HTML文件”对话框，如果你想使用CutePage网页编辑器插入组件，则选择“使用CutePage的‘文件/组件引入．．’功能插入组件”复选框，这样点击“确定”后CutePage编辑器将会自动起动。反之则去掉该复选框的选择，直接点击“确定”即可，这时“插入到（当前网页文件名）”对话框连同你所选择的网页文件将会被一起打开（^34040702c^3），这样就可以在该网页的代码窗口中使用“插入”命令来插入DHTML组件了。插入以后，资源文件将自动复制到该目录下。
　　　　好了，经过最后一步以后，创建的DHTML动画效果就已经插入到网页中了，利用浏览器打开该网页即可浏览到精彩效果了！图3所示就是刚才创建的日历网页动态效果。 
 