JavaScript创建可维护幻灯片效果(3)
作者:blank 来源:蓝色理想 发布时间:2008-06-21 16:42:00
第三步、基本的工具方法( Essential Tools)
现在,我们有了规划和建立我们脚本的框架。是时候思考我们需要完成这个功能的一些工具方法。在其最低要求的情况下,DOM 脚本的帮助库应该包括:
一个注册事件处理函数的方法,我们目前将使用 John Resig 的 addEvent() 方法。
添加和移除 CSS 样式名的方法。
一个覆盖 HTML 元素默认行为的方法。我们不希望出现链接的目标页,而仅是执行脚本。
我们添加这些工具方法到主要的对象上,并准备开始:
JavaScript:
slideshow = {
current:0, // 当前幻灯片编码
init:function(){
// 初始化和设置事件处理函数
},
show:function(e){
// 事件 *
},
addEvent:function( obj, type, fn ) {
if ( obj.attachEvent ) {
obj['e'+type+fn] = fn;
obj[type+fn] = function(){
obj['e'+type+fn]( window.event );
}
obj.attachEvent(’on’+type, obj[type+fn] );
} else
obj.addEventListener( type, fn, false );
},
removeClass:function(o,c){
var rep=o.className.match(’ ‘+c)?’ ‘+c:c;
o.className=o.className.replace(rep,”);
},
addClass:function(o,c){
var test = new RegExp(”(^|\\s)”+c+”(\\s|$)”).test(o.className);
if(!test){o.className+=o.className?’ ‘+c:c;}
},
cancelClick:function(e){
if (window.event){
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (e && e.stopPropagation && e.preventDefault){
e.stopPropagation();
e.preventDefault();
}
}
}
当文档完全载完,第一件事情就是需要执行 init() 方法:
JavaScript:
slideshow = {
current:0, // 当前幻灯片编码
init:function(){
// 初始化和设置事件处理函数
},
show:function(e){
// 事件 *
},
addEvent:function( obj, type, fn ) {
if ( obj.attachEvent ) {
obj['e'+type+fn] = fn;
obj[type+fn] = function(){
obj['e'+type+fn]( window.event );
}
obj.attachEvent(’on’+type, obj[type+fn] );
} else
obj.addEventListener( type, fn, false );
},
removeClass:function(o,c){
var rep=o.className.match(’ ‘+c)?’ ‘+c:c;
o.className=o.className.replace(rep,”);
},
addClass:function(o,c){
var test = new RegExp(”(^|\\s)”+c+”(\\s|$)”).test(o.className);
if(!test){o.className+=o.className?’ ‘+c:c;}
},
cancelClick:function(e){
if (window.event){
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (e && e.stopPropagation && e.preventDefault){
e.stopPropagation();
e.preventDefault();
}
}
}
slideshow.addEvent(window,’load’,slideshow.init);
猜你喜欢
- Web 标准要求一览表Russ WeakleyJjgod Jiang14-Aug-2004目录1 Web 标准,不仅仅是“不用表格的站点”2
- 为了方便使用分类,我定义了一个分类表category,里面字段是id(自动编号) cat_name(分类名) pare
- var fso = new ActiveXObject("Scripting.
- 阅读作者的上一篇相关文章:段正淳的css笔记(3)标题右侧“更多”的实现 段正淳的css笔记(4)1、css代码的简写css缩写的语法,对新
- 这个是我在蓝色看到的,楼主想实现图片按比例缩放的功能(缩略图),把图片固定在一定的宽高范围内,不会变形,失真。例如:缩略图的框是94px*9
- 本文列出了初学网页编程中常用到的一些代码和一些技巧,简单实用,您一定用得到。1、oncontextmenu="window.eve
- 使用ASP设置指定站点CPU最大使用程度'=============================================
- 问题:在安装SP4补丁的时候,老是报验证密码错误。上网查了一下资料,发现是一个小bug。按照一下操作,安装正常。SQL Server补丁安装
- 小贤是一条可爱的小狗(Dog), 它的叫声很好听(wow), 每次看到主人的时候就会乖乖叫一声(yelp).从这段描述可以得到以下对象:fu
- 大家都知道JAVA里最流行的是MVC模型的编程方式,如果你不知道MVC的概念,可以去网上搜索下,应该会马上找到N多资料。PHP5推出之后,也
- 最近为数据库服务器增加了内存,达到了最大支持的8G,数据库用的是mssql 2005 ,之前内存一直是4G的,不存在内存大和32位操作系统冲
- 今天同学向我提了一个问题,我觉得蛮有意思,现记录下来大家探讨下。问题是:在一个表里面,有一个允许为空的字段,空是可以重复的,但是不为空的值需
- asp按关键字查询XML的问题 '-------------------------------------------------
- position属性可以让你让你随意控制一个特定元素在浏览器何处以及如何显示。比方说我们用position:fixed 让一个图片显示在浏览
- 最近被“模块化”缠身,又是文章又是PPT的,被逼着想了很多相关的东西。整理下我这段时间对于“模块化”的思考,大多都是我自己从事页面重构这份工
- 介绍两个关键的CSS <style media="print">  
- 1、Export/Import的用处 Oracle Export/Import工具用于在数据库之间传递数据。 Export从数据库中导出数据
- 第四篇《WEB标准能有多难?》专栏文章将结束关于文本部分的XHTML的讲解。那么这篇主讲的内容涉及链接、标题、插入、删除、上下标、分割线、换
- 作用:用ASP程序将页面中的电话号码生成图片格式。以下是引用片段:<% Call Com_CreatValidCode(Request
- 一个页面执行一次Sql语句的话,不会影响到性能。如果一个页面要执行很多次Sql语句,而且使用的是同一个数据库连接,那么上面的方法可能会影响到