1. 简介：
官方主页：http://script.aculo.us/
官方WIKI：http://wiki.script.aculo.us/scriptaculous/show/Usage* *
Scriptaculous是基于prototype.js框架的JS效果。
下载&安装：
Scriptaculous包含了6个.js,scriptaculous.js是主文件.
把这6个文件放于同一个目录下，引入scriptaculous.js，会默认把其他5个都都引入了(原理见本文最后)
<head>中引入如下：
<script src="javascripts/prototype.js" type="text/javascript"></script>
<script src="javascripts/scriptaculous.js" type="text/javascript"></script>
默认方式下，。如果只需要引入其中一部分，可以通过以下方式：
<script src="scriptaculous.js?load=effects,dragdrop" type="text/javascript"></script>
2.Effective
Effective 是 scriptaculous 最主要的功能之一, 可以直接以html 的 element_id为参数调用API, 比如：
<script type="text/javascript" language="javascript">
Effect.Appear('element_id');
</script>
也可以通过事件机制 :
<div onclick="new Effect.SwitchOff(this)">
Click here if you've seen enough.
</div>
---- 层的开关效果
<div onclick="new Effect.BlindUp(this, {duration: 16})">
Click here if you want this to go slooooow.
</div>
---- 帘幕上拉效果
通过 duration（持续事件）,fps（每秒帧数）,delay（岩石）之类的参数，可以实现更多效果。
更多Demo查看scriptaculous wiki上的Demos
3. 原理
scriptaculous.js引入其他js 代码如下：
var Scriptaculous = {
Version: '1.6',
require: function(libraryName) {
document.write('<script type="text/javascript" src="' + libraryName + '"></script>');
},
load: function() {
if ((typeof Prototype == 'undefined') ||
(typeof Element == 'undefined') ||
(typeof Element.Methods == 'undefined') ||
parseFloat(Prototype.Version.split(".")[0] + "." +
Prototype.Version.split(".")[1]) < 1.5)
throw("script.aculo.us requires the Prototype JavaScript framework >= 1.5.0"); $A(document.getElementsByTagName("script")).findAll(function(s) {
return (s.src && s.src.match(/scriptaculous\.js(\?.*)?$/))
}).each(function(s) {
var path = s.src.replace(/scriptaculous\.js(\?.*)?$/, '');
var includes = s.src.match(/\?.*load=([a-z,]*)/);
(includes ? includes[1] : 'builder,effects,dragdrop,controls,slider').split(',').each(
function(include) {
Scriptaculous.require(path + include + '.js')
});
});
}
}Scriptaculous.load();
分享到：
相关推荐
**Scriptaculous JavaScript库** Scriptaculous是一款基于Prototype JavaScript框架的动态效果库，它为Web开发者提供了丰富的动画和用户交互功能。"scriptaculous-js-1.9.0"是这个库的一个特定版本，旨在提供稳定性...
### Scriptaculous：一个强大的JavaScript视觉效果库 #### 引言 Scriptaculous是一个功能丰富的JavaScript库，专注于提供直观、动态且美观的视觉效果。它建立在Prototype JavaScript框架之上，利用DOM（文档对象...
scriptaculous 它是在javascrīpt程序库prototype之上构建的,能提供Ajax支持,主要致力于提供高交互性的可视化组件,提升Ajax应用的层次.在HTML页面中需要引用prototype和scrīptaculous程序库。 视觉特效 ...
**前端项目-scriptaculous.zip** 是一个包含script.aculo.us库的压缩文件，这是一个历史悠久的JavaScript库，专门用于提升Web应用程序的用户界面效果。在Web开发领域，前端项目通常是涉及HTML、CSS和JavaScript的...
《scriptaculous动画效果库effect.js的原理与使用详解》 在Web开发中，动态效果是提升用户体验的重要手段，而JavaScript库scriptaculous中的effect.js模块则是实现这些效果的利器。本文将深入探讨effect.js的工作...
Manning - Prototype and Scriptaculous in Action.2007 Manning - Prototype and Scriptaculous in Action.2007
Scriptaculous是基于prototype.js框架的JS效果。 Scriptaculous包含了6个.js,scriptaculous.js是主文件.
### 《Prototype and Scriptaculous Quickly》：深入解析Ajax开发框架 #### 一、引言：Prototype与Scriptaculous在Ajax开发中的角色 随着Ajax技术的快速发展，一系列第三方库应运而生，这些库简化了开发者的工作...
Scriptaculous文档 各种例子及接口 学习非常有用
根据给定文件的信息，我们可以深入探讨“Scriptaculous”这一JavaScript库的相关知识点，尤其是其与Ajax结合使用时的独特功能。以下是对标题、描述、标签以及部分内容的详细解析： ### Scriptaculous - Ajax.pdf #...
**Scriptaculous JS 1.8.2 教程与开发库详解** Scriptaculous是一款基于Prototype JavaScript框架的库，它为Web开发者提供了丰富的动态效果和用户交互功能。这款库以其简洁的API和多样化的特效著称，极大地提升了...
《Scriptaculous.js 1.8.1：Ajax与JavaScript框架的魅力解析》 Scriptaculous.js，一个在JavaScript世界中颇具影响力的库，以其强大的动画效果和丰富的用户交互功能，为Web开发带来了革命性的变化。这个名为...
**Scriptaculous-JS-1.8.2 类库详解** Scriptaculous是一个基于JavaScript的库，它在Web开发领域中扮演着重要角色，尤其在动态效果和用户交互方面。这个1.8.2版本是Scriptaculous的一个稳定版本，包含了多个核心...
### Scriptaculous Effects：视觉效果库的深入解析 #### 一、概述 Scriptaculous 是一个基于 JavaScript 的库，它提供了丰富的用户界面效果和动画功能，可以极大地增强 Web 应用程序的交互性和视觉吸引力。该文档...
**Scriptaculous JavaScript框架** Scriptaculous是一款基于 Prototype JavaScript 库的动态效果和用户界面库。这个框架的主要目标是提供一套简单易用的API，帮助开发者轻松创建丰富的用户体验和交互式网页应用。在...
"Scriptaculous JS 1.8.3" 是一个JavaScript库，主要专注于提供丰富的用户界面效果和Ajax功能。Ajax（Asynchronous JavaScript and XML）是一种在无需刷新整个网页的情况下，能够更新部分网页内容的技术。这个库简化...
例如，当用户点击某个链接时，LightWindow会使用Ajax请求获取相关数据，然后用Prototype创建新的DOM元素，最后由Scriptaculous执行动画效果，使弹窗优雅地出现在屏幕中央。 总的来说，Ajax、Prototype和...