首页
课程
首页
|
入门
|
硬件
|
软件
|
设计
|
开发
|
网络
|
小组
|
社区
|
加油站
当前位置：
首页
=>
课程
=>
Dreamweaver MX留言板实例教程
=>第6课 创建留言板站点主页面的其他元素和效果
第1课 DW MX工作环境简介及站点的建立
第2课 创建留言板动态站点及第一个页面
第3课 用表格布局留言板站点主页面
第4课 用CSS样式表设计留言板站点
第5课 创建留言板站点主页面导航元素
第6课 创建留言板站点主页面的其他元素和效果
第7课 用Fireworks MX画留言板站点页面
第8课 数据库基础和用Access2000创建留言板站点数据库
第9课 在Dreamweaver MX中创建数据库连接
第10课 初体验留言板主页面的动态效果
第11课 初体验留言板主页面的动态效果
第12课 初体验留言板主页面的动态效果
第13课 初体验留言板主页面的动态效果
第14课 初体验留言板主页面的动态效果
第15课 初体验留言板主页面的动态效果
第6课 创建留言板站点主页面的其他元素和效果
www.study51.com
【字体：
大
中
小
】【
打印
】【
关闭
】
经过前面5课的学习，我们对Dreamweaver MX创建和管理站点页面文档的前台技术有了一个概括的认识和应用了，实际上前5课所涉及到的应该是创建和管理站点的最基本的一些技术。掌握了这些技术，我们设计一般的静态站点应该是没有问题了。那么现在开始留言板站点的后台程序的创建？按道理是可以讨论这方面的问题了，但我还想再讨论一些站点页面的其他元素和效果的创建方法。虽然这些技术可能和我们的留言板站点关系不是很大，但是因为它们也是一些常用的技术和方法，我们还是在这里系统的学习一下吧。
一、利用时间轴和层实现页面中的滚动字幕效果。
小字报：今天留言板的最多的问题是这个教程共有几课？
看到上面这个滚动字幕的效果了吧，它是通过在Dreamweaver时间轴面板中定义层的移动动画来实现的。什么？Dreamweaver也有时间轴？是的，而且你用它可以设计出不错的动画效果呢。而且用这样的技术设计出来的动画效果更符合web的特征。
1、单击插入栏中常用标签下的层命令按钮
，在页面中拖拽鼠标插入一个层。在层中输入需要的字幕文字。
2、打开时间轴面板。执行“窗口/其他/时间轴”命令打开时间轴面板。
3、将页面文档中的层选中，并把它拖放到时间轴的时间线上。默认的情况是插入的动画长度为15帧，相应的层名（Layer1）显示在该动画栏中，并且在动画栏的两端自动加入了两个关键帧。
4、在时间轴面板的动画栏上的关键帧按下鼠标左键并左右拖动，则可以改变关键帧的位置。向右拖动第15帧上的这个关键帧以延长关键帧到60帧，如图1所示。
图1 时间轴面板
5、在第30帧鼠标右键单击，在弹出的快捷菜单中选择“插入关键帧”命令，在第30帧插入一个关键帧。
6、单击第30帧，然后将页面文档中的层水平向右移动合适的距离如图2所示。
图2 层的运动轨迹
7、在时间轴面板中选择：自动播放和循环，并把行为标志拖放到第60帧的位置，如图1所示。
这个左右来回滚动的字幕效果就完成了，简单吧？其实时间轴和层结合在一切定义动画还有很多技巧，以后慢慢研究吧。：）
二、创建当页面载入时弹出窗口的效果
先单击这里观看具体页面效果
我们可以看到页面载入时弹出了一个信息提示对话框窗口，接着又弹出了一个自定义外观的浏览器窗口。这两个效果都是通过在行为面板中定义页面载入时的行为而实现的。我们定义页面载入时的行为实际上就是定义< body >标签的行为。
▲弹出信息提示对话框窗口
1、在标签检查器中单击选中< body >标签，这时整个页面文档就会变成灰色状态。
2、打开行为面板，单击
按钮打开行为命令下拉菜单，选中其中的“弹出信息”行为命令，如图3所示。
图3 行为面板——定义行为
3、在出现的弹出信息对话框的信息文本框中输入想弹出的提示信息。
▲打开浏览器窗口
1、在标签检查器中单击选中< body >标签，这时整个页面文档就会变成灰色状态。
2、打开行为面板，单击
按钮打开行为命令下拉菜单，选中其中的“打开浏览器”行为命令，如图3所示。
3、在打开浏览器窗口设置对话框中进行将要打开的浏览器窗口的外观的参数定义，如图4所示。
图4 打开浏览器窗口的外观参数的定义
行为面板是个很重要的面板，我们在创建页面效果时会经常用到它，它里面有很多常见的效果的定义。比如定义页面的状态条信息、检查页面提交表单的正确性等等。以后要多研究研究它哦~
三、禁止访问用户的右键单击
现在你用鼠标右键在这个页面上单击一下试试……你的右键失效了吧，想把我的页面上的资源马上拿走？嘿嘿~还是再费点工夫吧。
1、将页面文档视图转换到“代码视图”模式，然后将光标定位在< /body >前面一行。这里就是我们将要插入JavaScript脚本代码的地方。
2、执行“插入/脚本对象/脚本”命令，会弹出一个插入脚本对话框，如图5所示。
图5 插入脚本对话框
3、按照图5进行设置，然后确定以后，看看我们的页面文档中出现了什么：
< script language="JavaScript" type="text/JavaScript" >
< /script >
这是一对< script >标签，它定义了在页面中将要插入的脚本所使用的语言。我们通过步骤2得到的这样一个结果，当然也可以手工输入这些代码来实现。
4、将光标定位在< script language="JavaScript" type="text/JavaScript" >与< /script >之间。
5、打开代码片段面板，选择展开其中的“JavaScript/浏览器函数”，然后鼠标双击“禁用右键单击”，如图6所示。
图6 插入代码片段
完成以上操作以后，你会发现在< script language="JavaScript" type="text/JavaScript" >与< /script >之间插入了一段脚本代码。这样就基本OK了，当然我们还可以改一下警告信息。改这里：var message = "嘿嘿，右键不能拿我的东西！";
四、自动搭上著名的搜索引擎，提高自己网站的访问率
自动提高自己网站的访问率？这么好的事情谁不想知道！其实很简单，方法就是让著名的搜索引擎帮助我们。许多搜索引擎装置（自动浏览网页为搜索引擎收集信息以编入索引的程序）读取关键字meta标签的内容和说明meta标签的内容，并使用该信息在它们的数据库中将您的页面编入索引。在Dreamweaver MX中如何实现这个技术呢？
1、单击插入栏下的“文件头标签”，如图7，我们要使用文件头标签下的两个按钮命令。
图7 文件头meta标签属性
2、单击图7所示的“关键字属性”按钮，在弹出的关键字设置对话框的关键字文本框中输入站点的关键字。比如：闪客，教程，flash等，注意多个关键字之间用逗号隔开。
3、单击图7所示的“说明属性”按钮，在弹出的说明设置对话框的描述文本框中输入对站点的描述文字。比如：本站点是一个专门讨论动画设计和网站建设的站点，有大量的原创教程。
【字体：
大
中
小
】【
打印
】【
关闭
】
关于我们
|
广告服务
|
诚邀加盟
|
友情链接
|
网站地图
|
联系方式
Copyright ©1998-2005, All Rights Reserved.
版权所有 学习无忧网 51study.net
广告或空间合作，请QQ：70046085联系我
，在页面中拖拽鼠标插入一个层。在层中输入需要的字幕文字。
按钮打开行为命令下拉菜单，选中其中的“弹出信息”行为命令，如图3所示。
