网络编程
位置:首页>> 网络编程>> JavaScript>> JavaScript创建可维护幻灯片效果(3)

JavaScript创建可维护幻灯片效果(3)

作者:blank 来源:蓝色理想 发布时间:2008-06-21 16:42:00 

标签:javascript,幻灯片,效果

第三步、基本的工具方法( 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);


0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com