Dreamweaver如何制作会移动的广告条
作者:陈鹏飞 发布时间:2010-10-20 20:04:00
在许多网页中,当鼠标移到一张图片上时,又弹出另一张图片,做这种广告条,要用到Macromedia DreamWeaver中的Layer(层)和Timeline(时间轴)功能,还得准备两张大小基本相同的广告图片。我们已最新版本DreamWeaver4.0(英文版)为例,制作移动的广告条。
一、用DreamWeaver打开任意一个网页,空白页也可。在菜单中选择“插入Insert”-> “层Layer”,即看到网页中多了一个空白Layer1,你也可以为他命名。再将光标点到空白Layer1内,选择“插入Insert”-> “interactive Image”-> “rollover image”,在弹出的对话框中分别插入你的广告条的图片(请注意original image 表示第一张图片,rollover image 表示当鼠标移到第一张图片时,又出现的图片,而且一定要把preload rollover image选中),调整层大小,使层尽可能与图片大小相近。
二、在菜单栏选择“修改Modify”-> “时间轴Timeline”-> “添加对象到时间轴Add object to Timeline”。点击后,弹出对话框,告诉你只有图象和层才能添加到时间轴。对话框按确定后,我们选中Layer(单击层标记或层边界,或用层面板选择一层,当一个层被选中时,层边界会显示出调整大小手柄,按住鼠标左键不放,拖进时间轴动画栏的第一频道,即面板上竖写1,2,3等等的“1”那行,时间轴里面马上增加了一个默认的15帧动画。
然后,单击动画栏最后关键帧标记,再选中页面中的层Layer1,将它拖动到动画的结束点,或者在“层的属性面板”改变层的“左L”属性大小来确定结束帧层的位置。此时,页面中显示了从动画起始位置到结束位置有一线条,这就是层的运动轨迹。要想让页面打开时候它就开始运动,就在“时间轴TimeLine”面板上的“自动播放Autoplay”前打勾,如图3所示:按在时间轴上中部的“-> ”箭头不放,就可以直接预览这直线动画了,或者按下F12键预览。
接下来,我们要进行一系列美化工作,因为这个简单的直线运动效果并不美观,而且广告图片也没有产生变化。
三、改变时间栏的属性产生移动变化
(1)在动画移动距离不变的情况下,改名动画移动速度。因为我们拉层进时间轴面板起始时候的帧数是默认的15帧,在上面预览时候就感到速度有点快。要改变速度,我们就得改变动画总共帧数。鼠标左击选中“时间轴面板”中的“第一频道”结束帧不放,向右拖动至你所想要的结束帧,例如75帧处,放开鼠标。此时,结束帧的空白小圆也移至到了第75帧处。按F12预览一下,动画的移动速度明显变慢。但是要注意的是我们只是在保持动画运动轨迹的长度不变的情况下,改变了动画移动的速度,即时间轴上的帧数。如果在同时改变改变起始和结束帧层的位置,就会产生各种不同速度效果,读者可以自己试着尝试。
(2)产生曲线的运动。上面做的动画只是简单的直线运动,如果改变成曲线的运动,美观程度就大大的加强了。曲线运动中最主要的就是关键帧的设置(只要学习过flash的,这点非常容易理解)。
a.在“时间轴面板动画栏”上添加一个关键帧: 选择动画栏的第一频道中你想要添加关键帧处, 单击鼠标右健,选择“add keyframe”,即刻在插入点位置添加一个关键帧。
b.在添加的关键帧处移动层:在保证选中了后来添加的关键帧下,选择页面中的层,移动层至你所想要的地方。此时直线变化成了曲线。你可以多添加几个关键帧,再移动层,使产生的曲线移动更加光滑。按F12键预览,曲线效果是不是比以前的直线效果好多了?
另附:在使用Dreamweaver4(英文版)的过程中,一次想用layer作动态广告,但无论如何都无法插入layer和table,但无论是重新安装还是汉化都无法使用,由于同事使用过,而且同事也正在学习英文版,因此我想是不是在哪个地方的设置被修改的原因呢?找完所有的设置才发现:只要把 “view菜单下的table view --> layout view修改为standard view,就可以插入layer和table了。
猜你喜欢
- 准备工作去年的时候,青云发表过关于栅格系统的文章 . 我们知道网页的栅格系统是运用固定的格子设计版面布局,使其风格工整简洁. 视觉上来说,栅
- 保护你的ASP页面的两种办法 有时候你只想让人们从你的站点来访问你的某些页面, 而不允许他们从其它站点的非法链接中到达这些页面。在你想保护的
- 本文讲解了一个使用XML技术上传文件的例子,使用该方法没有传统方法中的种种限制。 这个例子讲述了如何使用MSXML3.0和ADO Strea
- 要使数据库具备更强的抵御侵犯的能力,你要采取几步措施。有些措施只是良好的服务器管理的一部分,如拥有SQL Server最新的补丁,其他则包括
- 问题1:使用.net2005自带的SQL-Express连接不上。解决方法:1.网络防火墙阻止数据库连接;2.默认SQL-Express没有
- 由于数据库中的每张表中的字段名不一样,所以在写后台程序的时候,通常会写多个页面,对应不同的表。这里介绍一个函数,适合所有的表,不需要再为每一
- 现像如下:站点无法打开,或者打开很慢.HTML可以打开.重新启动或者回收应用程序池可恢复.但过一段时间又会出现日志里会有:ISAPI
- sql代码如下:CREATE PROCEDURE Proname //使用CREATE PROCED
- 原文:http://www.smashingmagazine.com/ ... emarkable-favicons/翻译:Blank(怿飞
- 一、使用css缩写使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。css缩写的主要规则请参看《常用css缩写语法总结》,这里就不展开描
- 有时需要获取远程网站的某些信息,而服务器又限制了GET方式,只能通过POST数据提交,这个时候我们可以通过asp来实现模拟提交post数据,
- 在最近一个项目中,表单验证需要对时间的起止范围进行判断:结束时间需大于或等于开始时间。即:结束年须大于起始年;如果相等,则比较起始月与结束月
- 可用下面提供的强制登录的程序,它也可以用来做会员注册的。security.asp<%bLoggedIn =&nb
- 以下插件是我在项目中经常使用的jQuery插件,不见得是最好的,但是我目前接触到的jQuery插件中最适合我的。01. jQuery.Fle
- 如何用POP3接收电子邮件?POP3大行其道,我看见朋友已经用Jmail和POP3接收邮件了。该如何做?以Jmail4.1为例,我们演示一下
- '================================================ '
- 大家都知道连续的英文或数字能是容器被撑大,不能根据容器的大小自动换行,网页设计初学者可能不知道怎么处理,下面是CSS如何将他们换行的方法!对
- 一、“无”的哲学佛家讲究“因果报应”,有果必有应。此段看似与主题没有血缘关系,实际讲的是“因”。我个人比较喜欢老子的道家思想,并喜欢以其思想
- 通过status命令,查看Slow queries这一项,如果值长时间>0,说明有查询执行时间过长以下为引用的内容:mysql>
- MySQL的命令行提示符及其表达的意思mysql> 准备好接受新命令。 &n