Dreamweaver行为的应用

  • 来源: 中国IT实验室 作者: somesun   2008-03-17/09:28
  • 如果想要使网页更“聪明”的话,就要使用行为来感知外界的信息并做出相应的响应。这些外界信息包括鼠标的活动,如页面的调用与关闭、鼠标移动到页面元素上点击元素或移开元素,以及焦点的改变和键盘的情况等各种变化,对不同的页面内容有不同的事件,另外能够响应的事件也和浏览器有关,一般说来,3.0的浏览器能够响应的事件要少于4.0浏览器,而IE4能够响应的事件要多于Netscape4.0浏览器,我们可以根据不同的浏览器进行不同的设置。

        图A三是一个简单的例子,这个页面有两项内容,一部分是上面的文字“Click here for more information"并成为一个超链接,下面是一个汽水瓶的图片。现在想要产生这样的效果,当浏览者将鼠标移到超链接的文字之上的时候发出一段开启汽水瓶的声音,这段声音是已有的资源。我们可以这样做。将超链接设置成工作的焦点,可以用鼠标在这行文字上点一下。这时调出行为浮动面板(window菜单的behavior命令),

    a4.gif (7986 bytes)

          如图A四这个浮动面板一共有两部分组成。左边是事件,右边是对事件的响应。我们可以看到浮动面板的事件栏中显示了 Events ,表明现在是对刚才选中的超链接所产生的各种可能的事件。在这一栏中我们可以选择浏览器的类型,例子中是选择IE4作为目标浏览器,我们点击加号会弹出一个菜单,菜单中列出各种可能产生的事件。我们选择事件,当鼠标移动到目标元素上的时候就会产生事件信息,选中以后这一事件被加入事件栏中,一个页面元素可以激发许多事件。当一个事件有响应的时候这个事件才是有价值的事件,因为即使没有选事件也是存在的,也是会在适当的时候被激发,只是没有响应所以对页面没有任何影响。用同样的方法我们点击行为浮动面板右侧的响应栏中的加号按钮,这里也列出了所有可能的响应,包括改变属性、检查插件、声音控制、浏览器状态条显示何种信息,跳到指定的地址上,打开新的浏览器窗口。弹出消息以及层的变化等等。我们选择声音控制(control sound )一项,这时会自动弹出对话框提示我们开始和结束声音。

            图A五就是弹出的对话框,选择合适的声音文件后(注意,要选择网页允许的声音文件格式)整个有关本例的事件及响应的设置就完成了。我们没有编写一句代码就完成了较为复杂的交互式操作,这足以表明Dreamweaver在编写高级网页时的优越性。

    a5.gif (8624 bytes)


    我们可以用这种方法编写出十分精彩的网页,比如:当我们开启一个网页的时候先奏一段音乐(这里用到对onLoad事件的响应),当浏览者将鼠标移动到网页的各个项目上时,这一项目闪烁并响起音乐且状态条显示项目的说明(这里用到对onMouseOver事件的响应,响应为图片来源控制、声音控制和状态条信息的设置),当浏览者随超链接进入新的页面并点击页面的MOV格式的电影时检查浏览器是否有quicktime插件,如果有就播放这段电影(对onClick事件响应,响应为检查插件),我们可以将一幅图片作为一超链接,当浏览者点击或按下任意键时显示目标页(用到对onKeyPress 和onMouseOver事件的响应),如果是商业或教育网页我们还可以对onHelp 和onError等事件产生响应。我们还可以对整个页面进行控制(用到对onReadyStateChange事件的响应),如果浏览者结束浏览时说一些感谢的话或传达一些信息或打开相关网页就要用到对onClose事件的响应等等,还有许多更精彩的事件和不同寻常的响应事件留给广大读者去发现吧。


    评论 {{userinfo.comments}}

    {{money}}

    {{question.question}}

    A {{question.A}}
    B {{question.B}}
    C {{question.C}}
    D {{question.D}}
    提交

    驱动号 更多