自己做的js幻灯片类库，欢迎使用，欢迎拍砖。
用了两个晚上，封装了一个js幻灯片的函数(类库？框架？)，随你怎么叫。因为自己做网站用到，以前都是用flash壳，麻烦，后来用jquery插件，太大。所以自己动手做了一个，压缩后只有3k。窃以为比较使用，跟大家分享，欢迎各路大牛批评指正。
测试页面在：http://gf-zj.com/slider/
打包下载地址：http://gf-zj.com/slider/slider.zip

/**
 * i use closure to simulate private method in OOP,because i don't wanna disturb the others js libraris you may use like jQuery,which uses $
 * remember the only variable i inject to window is Slider
 *
 * (c)logan liu
 * Email:hellouniverse@qq.com
 * if you find bugs,Don't hesitate contacting me.
 */
(function(window){

    function Slider(contentID, handlerID, pageNum, onePageWidth, direction, step, speed){
        if ((!contentID) || (!handlerID) || (!pageNum) || (!onePageWidth)) {
            alert("init error,see your paraments");
        }
        this.contentID = contentID;
        this.handlerID = handlerID;
        this.pageNum = pageNum;
        this.onePageWidth = onePageWidth;
        this.step = step || 10;
        this.direction = direction;
        this.speed = speed || 1;
    }
    var $ = function(id){
        return document.getElementById(id);
    }
    
    var style = function(sid, key, value){
        if (value) 
            $(sid).style[key] = value;
        else 
            return $(sid).style[key];
    };
    /**
     *
     * @param {Object} id
     * @param {Object} i
     *	0-100
     */
    var fade = function(id, i){
        style(id, "filter", "alpha(opacity=" + i + ")");
        i = i / 100;
        style(id, "-moz-opacity", i);
        style(id, "-khtml-opacity", i);
        style(id, "opacity", i);
    };
    
    var log = function(){
        if (!window.console) 
            return;
        // console.log(arguments.callee.caller.toString());
        for (var i in arguments) {
            console.log(i + ":" + arguments[i]);
        }
        
    }
    var addEvent = function(elm, evType, fn, useCapture){
        if (elm.addEventListener) {
            elm.addEventListener(evType, fn, useCapture);
        }
        else 
            if (elm.attachEvent) {
                elm.attachEvent('on' + evType, fn);
            }
            else {
                elm['on' + evType] = fn;
            }
    };
    var dump = function(o){
        for (var i in o) {
            log(i + ":" + o[i]);
        }
    };
    
    Slider.prototype = {
        changeEvent: "onclick",
        leftAndRightArrow: false,
        pageHandler: true,
        currentPage: 0,
        transformEffect: "",
        intervalId: 0,
        duration: 6000,
        /**
         * anything can case to false stands for horizontal.and the others are vertical.
         */
        direction: 0,
        /**
         * rend page navigator like 1,2...,so you can override it with you method such as page1,page2..or just empty.
         * @param {Object} i
         */
        rendPageNav: function(i){
            return i == -1 || i == this.pageNum ? "" : (i + 1);
        },
        /**
         * set navigator's class when clicked.add "current" to this.currentPage
         * @param {Object} i
         */
        rendNav: function(j){
            var c = $(this.handlerID).children;
            j = this.leftAndRightArrow ? (j + 1) : j;
            for (var i = (this.leftAndRightArrow ? 1 : 0), l = (this.leftAndRightArrow ? c.length - 1 : c.length); i < l; i++) {
                c[i].className = (i == j ? "current" : "");
            }
        },
        initHandler: function(){
            var tempThis = this;
            for (var i = (this.leftAndRightArrow ? -1 : 0), len = (this.leftAndRightArrow ? this.pageNum + 1 : this.pageNum); i < len; i++) {
                if ((!tempThis.pageHandler) && i != -1 && i != tempThis.pageNum) 
                    continue;
                var a = document.createElement("a");
                a.href = "#nogo";
                a.className = (i == -1 ? "left" : (i == 0 ? "current" : (i == this.pageNum ? "right"