用scriptaculous增强Web应用程序

开发者在线 Builder.com.cn 更新时间:2007-01-30作者:builder.com.cn 来源:

在页面上拖动项目

scriptaculous库的一个显著特点在于,它可以方便地在页面上拖动元素。也就是说,用户可以在页面上选择一个元素,然后用鼠标把它拖动到另一个地方。列表C说明如何实现这种操作。

前一个例子的关键之处在于在代码的末尾建立Draggable对象。和scriptaculous的所有特点一样,这个代码应放置在所有必要的页面元素之后(页面末尾最好)。

因此,要使一个元素可在页面上拖动,只需建立一个新的Draggable对象实例,再把对象名称作为第一个参数提交即可。当用户释放一个项目(真),或将它移动到新位置(假)时,可选的回返参数允许你指定该项目是否返回到原始位置。你可以将它与Droppable对象结合使用,从而定义项目的放置位置。Droppable对象还允许你访问已被移动或放置的项目。

视觉效果

移动和元素分类很有用,但scriptaculous还可以在页面上轻松实现各种视觉效果,从而提供更多乐趣。你可以对页面元素应用大量的视觉效果,列表D中的例子仅使用了其中几个效果。

这个页面包含三个图片和一个文本元素。第一幅图片通过Effects.Fade方法逐渐淡出视线;第二幅图片通过Effects对象的Pulsate方法在屏幕上闪烁或跳动;第三幅图片使用Effects对象的Shake方法前后晃动。最后,通过使用Effects.Highlight方法将页面的标题文本用灰色高亮显示。一旦页面和它的元素通过子元素的onLoad事件加载后,脚本即调用Effects对象和各种方法。

scriptaculous库提供的许多效果只有一个样本。你可以在scriptaculous wiki上找到更多与视觉效果有关的细节。

应用

scriptaculous库帮助你轻松建立各种令人兴奋的多功能Web用户界面。它将复杂的设计元素减少为几行脚本,因此你没有理由不在下一个(或现有的)Web应用程序中使用如此优秀的功能。现在就下载这个强大的工具并学习更多相关内容。

责任编辑:德东

查看本文国际来源

用户评论

  • 用户名
  • 评论内容