推荐: LOGO设计微信开发包装设计游戏开发接口开发手机网站开发VI设计文字设计Web前端开发网页设计客厅装修情人节表白Oracle数据库网站建设个人网站建设微信客户端

热门搜索: LOGO设计微信开发VI设计网站建设网站推广

当前位置: 威客百科 > 动态网页 > 动态网页制作教程
免费发布需求,接收报价与方案

动态网页制作教程

什么是动态网页?

猜您需要: 【asp动态网页设计】【什么是动态网页】【静态网页和动态网页的区别】【动态网页静态化】

      动态网页设计的基本方式主要有三种:手工编码方式、利用可视化的工具进行编辑、手工编码和可视化工具两者的相互结合。而网页图像制作工具一般能用的到的是诸如Firework MX、Photo Impact这些,动态网页中常见的动画效果是由Flash MX、Director这样的工具制作出来的。而网页编辑工具主要用到的是FrontPage 2000、Dreamweaver MX、 HotDog这些。


     在许多的网页中,我们经常能够看到有水中倒影的动态形式。我们可以通过Flash MX这个工具来实现。

     制作步骤是这样的:

     1.新建一个Flash MX文件,设置背景色为黑色,选“文件/导入”菜单导入一张图片,将其转化为图形元件,命名为“图片”。回到场景,将当前层命名为“图片”。从库中将元件"图片"拖入第1帧工作区中。

     2.新建一名为“倒影100”的图层,将该层放在“图片”层下方。将库里的元件"图片"拖入该层第1帧工作区中,并利用“修改 / 变形 / 垂直翻转”菜单将其倒放。然后调整两层中的图片的位置。

     3.在图层“倒影100”上方新增一个图层,将图层“倒影100”的第1帧复制到该层第1帧处。并将该层命名为“倒影60”。然后选中该层图片,在属性面板中将Alpha值设为60%。

     4.新建一层名为“遮蔽层”放在“倒影60”层上方。新建一图形元件“波浪”,用矩形工具画若干细长的矩形,做好后将其拖入场景区盖住倒影。

     5.在“遮蔽层”上方新增一层,名为“水面”。新建图形元件“水面”,内容为:用线形渐变填充的无边框矩形,从上向下由黑色过渡到蓝色,如图所示。回到场景,从库中将其拖入并盖住倒影,并将其Alpha值设为30%。

     6. 在“水面”层上方新增一层,名为“光线”,新建图形元件“光线”,绘制一个黑白渐变的扁椭圆,用来做图片和倒影的分界面。回到场景,将它拖放到“图形”与倒影之间,并将Alpha值设为20%。

     7.在 “遮蔽层”上右击鼠标,在弹出菜单中选“遮蔽层”项。并在该层的第35帧处插入关键帧,拖动“波浪”到倒影最下方,创建运动渐变动画。做完以上操作后,在各层的第35帧处插入帧。设置完成后。

     8.按CTRL+ENTER键测试动画,会看到水中倒影随波潋滟。

     在一些网页中当鼠标指针滑过某个链接或网页载入时会播放一段声音。在Dreamweaver MX中,使用“播放声音”动作可以完成声音的加载播放。这里需要说明是浏览器可能需要用某种附加的音频支持(例如音频插件)来播放声音。因此,具有不同插件的不同浏览器所播放声音的效果通常会有所不同。

     “播放声音”动作的设置步骤如下:

     (1)选择一个事件对象(链接、图象或整个文档“Body”)并打开“行为”面板。

     (2)单击加号 (+) 按钮并从“动作”弹出式菜单中选择“播放声音”,弹出声音播放对话框。

     (3)单击“浏览”按钮,选择一个声音文件或在“播放声音”域中输入路径和文件名。

     (4)单击“确定”,关闭对话框。

     (5)检查默认事件是否是所需的事件。如果事件对象是图片、文字等链接热点,则播放声音的事件一般是“onClick”即点击鼠标;如果事件对象是整个文档“Body”,则事件一般是“onLoad”即文档下载。

     在网络上还有其他许多很实用的教程,可以根据自己的需要进行学习和实践。

< 静态网页和动态网页的区别 之后没有文章了