最近开发需要 下载使用了 scriptaculous.js
发现滚动条只有 Y 轴方向的定位移动
自己补充了 X 轴方向的移动定位
增加了接口 ScrollToX
用法: new Effect.ScrollToX(Obj)
/*---------------------------
* Title:scrollToX
* Version: scriptaculous 1.5
* Using: Prototype 1.4
* Author:i5tt.com
* Date: 2006-08-08
* Web: www.i5tt.com
*---------------------------*/
Effect.ScrollToX = Class.create();
Object.extend(Object.extend(Effect.ScrollToX.prototype, Effect.Base.prototype), {
initialize: function(element) {
this.element = $(element);
this.start(arguments[1] || {});
},
setup: function() {
Position.prepare();
var offsets = Position.cumulativeOffset(this.element);
if(this.options.offset) offsets[0] += this.options.offset;
var max = window.innerWidth ?
window.width - window.innerWidth :
document.body.scrollWidth -
(document.documentElement.clientWidth ?
document.documentElement.clientWidth : document.body.clientWidth);
this.scrollStart = Position.deltaX;
this.delta = (offsets[0] > max ? max : offsets[0]) - this.scrollStart;
},
update: function(position) {
Position.prepare();
window.scrollTo(
this.scrollStart + (position*this.delta) ,Position.deltaY);
}
});
分享到:
相关推荐
**Scriptaculous JavaScript库** Scriptaculous是一款基于Prototype JavaScript框架的动态效果库,它为Web开发者提供了丰富的动画和用户交互功能。"scriptaculous-js-1.9.0"是这个库的一个特定版本,旨在提供稳定性...
**Scriptaculous JS 1.9.0:经典与实用并存的JavaScript库** Scriptaculous JS是一款在JavaScript世界中享有盛誉的库,尤其在它1.9.0版本时,其影响力与jQuery不相上下。这个库以其丰富的特效和易用性赢得了开发者...
**Scriptaculous JS 1.8.2 教程与开发库详解** Scriptaculous是一款基于Prototype JavaScript框架的库,它为Web开发者提供了丰富的动态效果和用户交互功能。这款库以其简洁的API和多样化的特效著称,极大地提升了...
《scriptaculous动画效果库effect.js的原理与使用详解》 在Web开发中,动态效果是提升用户体验的重要手段,而JavaScript库scriptaculous中的effect.js模块则是实现这些效果的利器。本文将深入探讨effect.js的工作...
### Scriptaculous:一个强大的JavaScript视觉效果库 #### 引言 Scriptaculous是一个功能丰富的JavaScript库,专注于提供直观、动态且美观的视觉效果。它建立在Prototype JavaScript框架之上,利用DOM(文档对象...
**前端项目-scriptaculous.zip** 是一个包含script.aculo.us库的压缩文件,这是一个历史悠久的JavaScript库,专门用于提升Web应用程序的用户界面效果。在Web开发领域,前端项目通常是涉及HTML、CSS和JavaScript的...
Scriptaculous文档 各种例子及接口 学习非常有用
"Scriptaculous JS 1.8.3" 是一个JavaScript库,主要专注于提供丰富的用户界面效果和Ajax功能。Ajax(Asynchronous JavaScript and XML)是一种在无需刷新整个网页的情况下,能够更新部分网页内容的技术。这个库简化...
根据给定文件的信息,我们可以深入探讨“Scriptaculous”这一JavaScript库的相关知识点,尤其是其与Ajax结合使用时的独特功能。以下是对标题、描述、标签以及部分内容的详细解析: ### Scriptaculous - Ajax.pdf #...
Scriptaculous是基于prototype.js框架的JS效果。 Scriptaculous包含了6个.js,scriptaculous.js是主文件.
scriptaculous 它是在javascrīpt程序库prototype之上构建的,能提供Ajax支持,主要致力于提供高交互性的可视化组件,提升Ajax应用的层次.在HTML页面中需要引用prototype和scrīptaculous程序库。 视觉特效 ...
### Scriptaculous Effects:视觉效果库的深入解析 #### 一、概述 Scriptaculous 是一个基于 JavaScript 的库,它提供了丰富的用户界面效果和动画功能,可以极大地增强 Web 应用程序的交互性和视觉吸引力。该文档...
这个名为"scriptaculous-js-1.8.1.rar"的压缩包,包含了Scriptaculous库的1.8.1版本,为开发者提供了一个高效、易于使用的工具箱,以提升网站的用户体验。 首先,让我们深入理解Scriptaculous.js的核心概念。它是一...
Scriptaculous 1.8.2版考虑了浏览器兼容性,支持主流的桌面和移动浏览器,包括IE6及更高版本、Firefox、Chrome、Safari和Opera。虽然随着现代前端框架的兴起,如React、Vue和Angular,Scriptaculous的使用频率有所...
《Prototype and Scriptaculous Quickly》这本书主要介绍了Prototype和Scriptaculous这两个相关的库,它们不仅为开发者提供了丰富的功能,还极大地提升了用户体验。 - **Prototype**:这是一个轻量级的JavaScript库...
《Scriptaculous.js库详解与应用》 Scriptaculous.js是一个基于JavaScript的视觉效果库,它为Web开发者提供了丰富的动态效果和用户交互功能。这个库是JavaScript社区中的一个亮点,尤其在网页动态化和增强用户体验...
Manning - Prototype and Scriptaculous in Action.2007 Manning - Prototype and Scriptaculous in Action.2007