第6章 网页特效与交互.pptVIP

返回本节 6.5.2 编写一个简单的JavaScript程序 本小节通过编写一个简单JavaScript程序制作一个带链接的水平滚动字幕效果，在网页中，这种效果一般用于广告宣传，非常醒目。实例的最终效果如图6-42所示。在网站首页的导航条下有一个带链接的字幕在水平方向上滚动。 图6-42 带链接的水平滚动字幕效果 返回本节 6.5.2 编写一个简单的JavaScript程序 本实例的制作步骤如下所示。 1．创建网页 （1）新建一个网页文档，将其保存为6.5.2.html。 （2）在这个网页中，利用表格进行布局，并在表格中输入相应的网站标题文字和导航条。效果如图6-43所示。 图6-43 制作网页 返回本节 6.5.2 编写一个简单的JavaScript程序 2．编写JavaScript程序 （1）切换到“代码视图”，在head/head中输入以下JavaScript代码： script language=JavaScript function gundong(){ var marqueewidth=400 //定义字幕宽度变量 var marqueeheight=20 //定义字幕高度变量 var speed=4 //定义滚动速度变量 var marqueecontents=欢迎访问a href=车行天下 网站/a //定义滚动字符串变量 document.write(marquee scrollAmount=+speed+ style=width:+marqueewidth ++marqueecontents+/marquee) //利用文档对象document的write方法输出marquee标签实现字幕滚动 } /script 这里用JavaScript定义了一个函数，函数名称是gundong()，这个函数实现的功能就是带链接的水平滚动字幕效果。 返回本节 6.5.2 编写一个简单的JavaScript程序 （2）因为本实例中滚动字幕的位置在导航条下边，所以要在导航条对应的代码后面插入JavaScript代码。 在“代码视图”下，将光标定位在最后一个/table标签后面，如图6-44所示。 将光标定位在这个位置 图6-44 将光标定位在 最后一个/table标签后面 输入以下JavaScript代码： script language=JavaScript type=text/javascript gundong() //调用函数 /script 至此，本实例制作完毕。保存文档并查看网页效果。 返回本节 6.5.3 使用“代码片断”面板 Javascript是在网页中实现动态和交互效果的基本手段之一，Dreamweaver提供了很多Javascript代码片断，可以在网页中直接引用。 本小节利用“代码片断”面板制作一个Javascript实例，为页面提供禁止用户使用鼠标右键的功能。通过这个实例可以学会使用Dreamweaver【代码片段】面板的方法以及调用Javascript的方法。 1．插入脚本标记 2．插入禁用右键的函数 3．调用Javascript函数 Thank you very much ! 本章到此结束， 谢谢您的光临！ 结束放映 返回本章首页 第6章 网页特效与交互 第6章 网页特效与交互 行为的应用 AP元素和时间轴 AP元素动画 Spry框架 JavaScript基础知识 开 始 在制作网页时，为了丰富网页内容，可以在网页中添加特效与交互。这样制作出来的网页，不但新颖、有风格，而且也能增加网站的访问量。Dreamweaver内置了一些行为，行为是被用来动态响应用户操作、改变当前页面效果或是执行特定任务的一种方法，利用行为可以高效地实现网页的互动效果。另外，利用AP元素（层）动画和Spry框架也可以实现网页的交互功能。 本章主要内容： 6.1.1 附加行为 6.1.2 行为应用实例――网页加载时弹出公告页 6.1.3 内置行为简介 返回本章首页 6.1 行为 行为是由一个事件（Event）所触发的动作（Action ），因此又把行为称为事件的响应，是被用来动态响应用户操作、改变当前页面效果或是执行特定任务的一种方法。事件是浏览器产生的有效信息，也就是访问者对网页所做的事情。例如，单击某个图像，鼠标经过指定的元素等。 Dreamweaver CS3内置了30多种行为，利用这些行为，不需要书写一行代码，就可以实现丰富的动态页面效果，诸如为网页添加播放音乐、