| 操作系统 办公 实用知识 设计 开发 WEB开发 移动开发 数据库 软件工程 网管 安全 管理 信息化 答疑 渠道 |
Dreamweaver行为全接触序 不知你是否有这样的经历，进入一个主页，立刻跳出一个提示要你马上下载Flash插件，还有当你用鼠标指向一个图片时，马上就会出来一个带音乐的小动画，等等。这些效果基本上都是用Jscript实现的，为了使我们网页更加绚丽多彩有必要学习Jscript吗？当然没有必要，每一种特效的Jscript代码几乎无需太多改动，就可以加到网页中直接使用，但还是要改一点点代码，对Jscript不熟的人来说是件很痛苦的事，好在强大的网页编辑工具DW3(是Dreamweaver 3.0缩写，下同)为我们提供了——行为(Behaviors)技术，它提供了一种利用简单直观的语句设置手段，为网页对象添加一些动态效果和简单的交互功能。 说了半天该让“行为”出场了，每个行为包括一个动作（Actions）和一个事件（Events）。任何一个动作都需要一个事件激发它，它们两个是相辅相成的一对。动作是一段先已编好的Jscript代码，这些代码在特定事件被激发时执行。比如：鼠标点击网页中某一特定对象时，就播放一段音乐或出来一个指定大小的窗口。 DW3为我们提供了大约20多种响应动作（Actions），常见和大家比较熟悉的诸如：Popup Message（跳出信息对话框），Open Browser Window（跳出一个指定窗口）等等，而DW3提供的事件（Events）就达40多个，没吓着你吧，我们只需掌握常用的20多个就可以了，我们熟悉的事件有：onMouseOver，onMouseOut，OnLoad，onclick等。 在此不得不谈的问题——兼容，不兼容是排除异己的最好竞争方法，这种竞争的结果对我们使用者和消费者没有多少好处，我们不得不在他们当中选取其一，对于鱼与熊掌都要的时代这是个痛苦的抉择。并不是所有的浏览器都支持这些动作和事件，当Netscape浏览器和IE浏览器杀得初见分晓的时候，我建议大家使用Ie浏览器，因为它有Mircosoft这个大后台，没有多少人敢不支持它。并不是有许多动作和事件它们互不支持，只是少量不支持而已，对此不要考虑太多。 本教程难度不大，适合于初学者和对某些行为不太清楚的朋友，本教程注重应用，重点放在一些范例的讲析。再谈谈本教程的基本模式，本教程将以行为为主体展开，我将详细地介绍每一个行为的两部分——动作和事件。先详细讲解每个动作的功能和菜单的基本设置，接着介绍支持这个动作的事件，讲一些典型的应用范例（每个动作至少1个范例），我将把事件穿插在范例中介绍。要强调的一点是我将不按顺序介绍行为。最后我要申明一点，由于我的水平有限，在讲述的过程中难免会出错，希望大家及时指出和多加包涵，有问题请来信或到酷页留言（www.kupage.com），在此先谢了！
“左三拳，右三拳，脖子扭扭，屁股扭扭.....”，我已热身好，你准备好了吗？本节将是开始教程之前的一次热身，在序言中讲到了什么是行为，以及行为的基本组成。下面将要讲到的是在DW3中行为面板的基本组成。 首先，我们得把行为面板调出来，用鼠标点击DW3编辑窗口中的Window->Behaviors（或在编辑窗口中按F8），即可出来Behaviors浮动面板，它的样子如：图一
就这么大一个浮动面板，里面蕴藏着无限技巧，先来看看 再来看看行为显示区，你当前对象用到的行为都将出现在此显示区中。显示区左边显示的是触发事件（Events），右边是动作。看看图一，被选中行为的动作左边有个小山角形，它是选择触发事件的下拉菜单，事件是不是有点多？不要迷茫，当你看完本教程就会云开雾散。 下节将讲述Popup Message（弹出信息提示框）。
第二节 不知你用过本站的留言薄没有，当你写完留言按确定时，马上弹出来一个感谢消息框，是不是觉得很体贴？那就是我今天讲的主题—Popup Message(弹出消息框) 一.认识 Popup Mesage编辑窗口 在DW编辑框中按F8调出Behaviors面板，点击
这是不是太简单了无需太多言语介绍，在空白处填入你要提示的消息填完按OK! 二.Popup Message的常见应用（也就是范例） 在讲范例之前我先讲几个要用到的事件（Events）： OnClik 网页中的指定对象被点击时，该事件触发。注意：鼠标的左健，右健都可以。 OnDblClick 网页中的指定对象被双击时，事件触发，同样鼠标左右健都有效 。 OnCopy 复制网页中的对象时该事件触发。 OnBeforCut 对网页对象剪切之前，该事件触发。 OnBeforCopy 对网页对象复制之前，该事件触发。 本动作（Actions）的第一个范例：点击一个对象弹出消息框。比如点击图片，按钮，链接等等，都可以弹出消息框，下面我讲讲点击按钮弹出消息框，搞定这一个其它的就如法炮制。以下是步骤： 1.用鼠标点击一下按钮对象，比如你的提交按钮或重写按钮。 2.按F8（或Window/Behaviors）调出Behaviors面板，点击 3.在Popup Message编辑框的空白处填入你要发布的信息，点击Ok。 4.在Behaviors面板的显示区，选择Popup Message动作并点击左边的一个小三角形，选择onclick事件，完工。 5.罗嗦一步，这个onclick事件可以换成OnDblClick事件或其它的事件。 如果某些页面的内容在别人复制之前想给一点提示，你可以选择OnCopy事件来触发Popup Message动作，这是本动作的第二范例，很简单实现这个效果，你只需把上个范例的事件改为OnCopy即可。我想强调一点，这个特效是在浏览其中用鼠标选取一些对象后，点击右健的“复制”命令时才被触发（消息框弹出两次），用键盘的Ctrl+C命令不能触发此事件。如此看来这个事件被触发的机会就比较少了，用OnBeforCopy事件或OnBeforeCopy事件就可以当你点击鼠标右健时在出现右健菜单之前，就可以触发动作。
当浏览一个免费主页时，经常会弹出一个小窗口，里面放一些广告或调查等等，这样做很容易吸引注意，这往往是服务提供商强迫的，人在屋檐下不得不低头！有的时候某些页面的内容不太多，给它订做一个比较小的窗口这还是很流行的（蚁盟就大量用到此技术），我们自己也可以DIY这样的窗口，这就是本节的内容--Open Browser Window（定制浏览器窗口） 一.认识Open Browser Window编辑窗口 在DW编辑框中按F8调出Behaviors面板，点击 RUL to Display：在定制窗口中要显示文件的路径，点击Browse...按钮来选择路径。 Window Width，Window Height：分别为定制窗口的宽和高度，单位是Pix。 Attributes(窗口属性)，定制你新窗口的界面。 Navigation Toolbar：导航工具栏；Location Toolbar：地址栏；Status Bar：状态栏；Menu Bar：菜单；Scrollbars as Needed:滚动条；Resize Handles：窗口大小可变。 Window Name：你定制窗口的名字 二.Open Browser Window的常见应用 在讲范例之前我先讲几个要用到的事件（Events）： Onload：当被指定对象（网页，图片，Flash插件等）开始在浏览器装载时事件触发。 OnUnload：当使用者离开当前页面时事件触发。 本节的第一个应用：打开一个页面出来一个定制的小窗口。 1.用鼠标点击页面的空白处后按F8调出Behaviors面板，点击 2.点击Browser...按钮选择你要显示的文件。 3.Window Width和Window Height分别填入你定制窗口的宽和高。 4.再来填Attribute（属性）选项，这就能者见能智者见智，根据具体需要选择适当的参数。这些参数可不填。 5.在Windows Name:中填入你的窗口名，点击确定。 6.如果Behaviors编辑窗口的显示区的Events不是Onload，你Open Browser Window动作并点击左边的一个小三角形，选择OnLoad事件，至此本范例完工。 注意：第一步中的鼠标一定要点击页面的空白处，不能是表格中的空白处或其它对象，否则在进行第6步操作时就没有Onload事件选择，也可以把Onload事件换成OnUnload事件，退出当前页面弹出定制窗口，就可以在此窗口中放入广告（赚一点广告费），这样做应该不会有人反感。 本节的第二个应用：点击一个链接出来一个定制的小窗口 1.先选择文字对象并做一个空链接。 2.用鼠标点击文字链接对象，再按照第一个应用的方法加入Open Browser Window行为。把第6步的Events（事件）改为onClick即可
为让网页的浏览速度更快，有时不得不用Flash动画代替Gif动画，但并不是所有的人都安装了其插件，一个好的网站为解决此问题，一般给出两种版本，Flash版和Html版，但需要我们自己选择进入那一个版本，随着上网的普及并不是所有的人都知道什么是Flash，什么是Html，这部分网民怎么选择？我们可以让你的网页自己做出选择进那一种版本，一解后顾之忧。这就是我们本节要讲的主要内容——Check Plugin(检查插件)。 一，认识Check Plugin编辑窗口 在DW编辑框中按F8调出Behaviors面板，点击 Plugin：第一项Select选择它提供的几种插件选项，一般常用的有Flash，Shockwave，Quick Time。而第二项是直接输入第一项没有列出的插件，一般很少用。 If Found,Go To URL：如果发现插件就打开当前页面。Otherwise,Go To URL：当没有发现插件就打开当前位置。 Always go to first URL if detection is not possible：这个选项一般不要选择，它是的意思是如果不能进行插件检查就进入第一个页面。 二，Check Plugin（检查插件）的常见应用 它的应用空间不太大，一般激发它的事件是OnLoad，所以本节就不再介绍其它的事件。对于这个应用我还是作一个简单的介绍： 1.在使用这个行为的时候一共要准备两个页面，一个是支持你插件的页面，另一个是不支持插件的页面。 2.用鼠标点击页面开始的空白处，否则将不会有OnLoad事件给你选择。 3.加入Check Plugin行为后，把事件(Events)改为OnLoad即可。 一个Check Plugin行为只提供检测一个插件，如果要求网页同时检查Flash插件和Shockwave插件，并分别进入不同的页面，怎么办？非常简单，只需再加一个Check Plugin行为，这是DW支持的，不过你还要制作一个版本的页面，当然你还可以加入更多的插件检查，我要提醒的一句是，那样会影响你网页的浏览速度。
浏览器的格局现在是两分天下，一分是IE，另一分是NetScape，在国内Ie有绝对的占有率，在这种情况下我们设计的网页只要兼容它就行了，但NetScape在国外还是有很多人使用，毕竟她是浏览器的元老。我们可以使用DW提供的Check Browser（检查浏览器）行为来使我们的网站更具亲和力，根据客户端浏览器的不同来选择不同的页面，下面请我慢慢道来。 一，认识Check Browser编辑窗口 初看这个编辑窗口还有点害怕，有好多选项，搞清楚这个动作的机制就不必害怕了，这个动作是由一组复杂的条件语句完成的，根据判断的结果做出选择，在三个网页当中选其一。这个行为可以明确判断两种浏览器：Netscape 和Ie，不是这两种浏览器一概做Other Browser 处理。判断每一种浏览器都会有三种选项，Go to URL（打开一指定文件），Go to Alt URL（打开另一指定页面），Stay on this page（停留在该页面）。URL和Alt URL是定义Go to URL 和Go to Alt URL所指向的页面。 二.Check Browser（检查浏览器）的常见应用 在启用Check Browser时，你最少要准备两个页面，一个是在IE下能正常浏览的页面，一个是在Netscape下正常浏览的。如果想充分发挥这个行为的功能，那就得准备三个页面，当网页检测到客户端浏览器类型不是IE和Netscape时启用第三个页面。如何填那些选项，在此没有必要讲的太详细，因为他的灵活性很大，但有必要把这个行为的工作流程讲详细一点，按上图的选项我讲一遍，首先网页判断浏览器是不是Netscape4.0 or later，如果是的话就打开Go to URL指向的页面，如果不是（otherwise）Netscape4.0 or later而是它以前的版本，也打开Go to URL指定的页面；如果网页判断浏览器是Ie4.0 or later的话就停留在当前页面，如果版本比Ie4.0 or later还低，同样停留在当前页面；如果网页判断的浏览器是其它的（other browsers）时，打开Go to Alt URL指定的页面。 最后强调一点，你的Check Browser行为应该加到Stay on this page 页面中。
今日推荐
|
重点推荐
领军企业技术文库
+更多领军技术文库
最新专题
电子杂志订阅
| ||||||||
，它是加入动作的按钮，用鼠标点击它会出现很多动作可以选择，在选项中黑色的选项是你当前对象支持的动作，而浅色的选项则是你当前对象不支持的动作。紧挨着得减号功能是，删除一个行为，你在编辑窗口中选取一个行为，在点击这个减号，就可以删除被选中的行为。 
，浏览器选项下拉菜单，严格来说不能称它为下拉菜单，因为他根本就没有下拉选项。这应该是DW3的一个Bug，没下拉菜单应如何选择浏览器？（别看这个问题很傻，但这是我回答网友最多的一个问题）点击Events for右边的小三角形，再用键盘的上下键选你需要的浏览器，一般选IE 5.0，浏览器的版本越高，他支持的事件就越多，这样就会有更多创意。 
，它们的功能是给行为排序，其实这个功能没有太大用去。只有在多个动作都是相同的触发事件时，这个功能才有用处。例如：希望别人进入你主页时弹出信息提示框和打开一个小窗口，由于网络速度的问题，两个动作之间有个时间差，此时你就可以使用此功能，给响应动作排个序。此范例今后要讲到它的实现方法，在此不必多费口舌。 
选Popup Message立刻出现以下窗口： 
选Popup Message。 
选Open Browser Window立刻出现以下窗口： 
选Open Browser Window，出来上图所示编辑框。 
选Check Plugin立刻出现以下窗口： 
