话不多说,直接上源代码

一、tool.js

封装一些共用方法,以及相关的浏览器兼容细节,供Base.js调用

//浏览器检测,一旦加载即执行
(function() {
    window.sys = {};
    var ua = navigator.userAgent.toLowerCase();
    var s;
    (s = ua.match(/msie ([\d.]+)/)) ? sys.ie = s[]:
        (s = ua.match(/firefox\/([\d.]+)/)) ? sys.firefox = s[] :
        (s = ua.match(/chrome\/([\d.]+)/)) ? sys.chrome = s[] :
        (s = ua.match(/opera\/.*version\/([\d.]+)/)) ? sys.opera = s[] :
        (s = ua.match(/version\/([\d.]+).*safari/)) ? sys.safari = s[] : ;

    ];
})();

//取代window.onLoad的页面初始化加载函数
function addDomLoaded(fn) {
    var timer;
    var isReady = false;

    function doReady() {
        if (timer) {
            clearInterval(timer);
        }
        //isReady限制该方法仅执行一次
        if (isReady) return;
        isReady = true;
        fn();
    }
    if (document.addEventListener) { //如果支持W3C,包括IE9+,chrome等
        addEvent(document, 'DOMContentLoaded', function() {
            fn();
            removeEvent(document, 'DOMContentLoaded', arguments.callee);
        });
    } ) || (sys.firefox && sys.firefox < ) || (sys.webkit && sys.webkit < )) {
        //下面两种方法都可以,不过这些低版本的浏览器市面上基本没有了,所以基本用不到
        /*timer = setInterval(function () {
            if (/loaded|complete/.test(document.readyState)) {  //loaded是部分加载,有可能只是DOM加载完毕,complete是完全加载,类似于onload
                doReady();
            }
        }, 1);*/

        timer = setInterval(function() {
            if (document && document.getElementById && document.getElementsByTagName && document.body) {
                doReady();
            }
        }, );
    } ) {
        //对于ie来说,检测readyState的方法,在页面具有iframe的时候失效,通过检测元素的scroll事件来实现
        timer = setInterval(function() {
            try {
                document.documentElement.doScroll('left');
                doReady();
            } catch (e) {};
        }, );
    }
}

function hasClass(elem, className) {
    return (new RegExp('(\\s+|^)' + className + '(\\s+|$)')).test(elem.className);
}
//获取元素的样式,可以是内联样式,也可以是写在外部样式表中的样式
function getStyle(elem, attr) {
    if (typeof window.getComputedStyle != 'undefined') { //W3C
        return window.getComputedStyle(elem, null) [attr];
    } else if (typeof elem.currentStyle != 'undefined') { //IE
        return elem.currentStyle[attr];
    }
}
//跨浏览器添加link规则
function insertRule(sheet, selectorText, cssText, position) {
    if (typeof sheet.insertRule != 'undefined') { //W3C
        sheet.insertRule(selectorText + '{' + cssText + '}', position);
    } else if (typeof sheet.addRule != 'undefined') { //IE
        sheet.addRule(selectorText, cssText, position);
    }
}
//跨浏览器移除link规则
function deleteRule(sheet, index) {
    if (typeof sheet.deleteRule != 'undefined') { //W3C
        sheet.deleteRule(index);
    } else if (typeof sheet.removeRule != 'undefined') { //IE
        sheet.removeRule(index);
    }
}
//跨浏览器获取浏览器视图的宽度和高度
function getViewSize() {
    var clientWidth = window.innerWidth;
    var clientHeight = window.innerHeight;
    if (typeof clientWidth != 'number') {
        if (document.compatMode == 'CSS1Compat') {
            clientWidth = document.documentElement.clientWidth;
            clientHeight = document.documentElement.clientHeight;
        } else { //IE6混杂模式下
            clientWidth = document.body.clientWidth;
            clientHeight = document.body.clientHeight;
        }
    }
    return {
        width: clientWidth,
        height: clientHeight
    }
}
//跨浏览器事件绑定,原事件绑定程序
//DOM0级事件绑定(onclick等),事件处理程序是在元素作用域,this引用的是当前元素;只能绑定一个处理函数
//DOM2级addEventListener(),元素作用域,可绑定多个,顺序执行
//DOM2级IE attacheEvent(),全局window作用域,其中的event也属于window的属性,可绑定多个,逆序执行(貌似这个函数有内存泄漏的问题?)

//综上,跨浏览器事件绑定程序,需要解决的问题包括
//1,支持同一元素的同一事件可以绑定多个处理函数
//2,如果同一元素的同一事件多次注册同一个处理函数,则仅生效一次
//3,函数体内的this指定的是当前正在处理事件的节点
//4,监听函数的执行顺序应当是按照注册绑定的顺序执行
//5,在函数体内,不在使用event=event||window.event,来标准化event对象
function addEvent(elem, type, listener) {
    //type = type.replace(/^on/i, '').toLowerCase();
    //将处理函数的作用域限制在元素内部,并将event对象传递过去

    if (elem.addEventListener) {
        elem.addEventListener(type, listener, false);
    } else {
        //为了避开attachEvent的内存泄漏问题,采用传统的事件绑定
        if (!elem.events) {
            //创建事件类型的哈希表
            elem.events = {};
        }
        if (!elem.events[type]) {
            elem.events[type] = [];
        }
        //判断同一个函数的事件是否已经被注册
        if (!addEvent.contain(listener, elem.events[type])) {
            elem.events[type].push(listener);
        }
        //真实绑定
        elem['on' + type] = addEvent.exec;
    }
}
//判断事件处理函数是否已经被注册
addEvent.contain = function(listener, listenerArr) {
    for (var i in listenerArr) {
        if (listenerArr[i] == listener) {
            return true;
        }
    }
    return false;
};
//IE下最终绑定的事件处理函数
addEvent.exec = function(event) {
    //这里的this就是绑定事件的elem了
    var e = event || addEvent.fixEvent(window.event);
    var fns = this.events[e.type];
    ; i < fns.length; i++) {
        fns[i].call(this, e);
    }
};
addEvent.fixEvent = function(event) {
    event.target = event.srcElement;
    event.preventDefault = addEvent.fixEvent.preventDefault;
    event.stopPropagation = addEvent.fixEvent.stopPropagation;
    return event;
};
addEvent.fixEvent.preventDefault = function() {
    this.returnValue = false;
};
addEvent.fixEvent.stopPropagation = function() {
    this.cancelBubble = true;
};

//跨浏览器删除事件
function removeEvent(elem, type, listener) {
    if (elem.removeEventListener) {
        elem.removeEventListener(type, listener, false);
    } else {
        var fns = elem.events[type];
        ; i < fns.length; i++) {
            if (fns[i] == listener) {
                fns.splice(i, );
            }
        }
    }

}
//获得元素在页面上的水平偏移量
function getElementLeft(elem) {
    var pNode = elem.offsetParent;
    var left = elem.offsetLeft;
    while (pNode) {
        left += pNode.offsetLeft;
        pNode = pNode.offsetParent;
    }
    return left;
}
//获得元素在页面上的竖直偏移量
function getElementTop(elem) {
    var pNode = elem.offsetParent;
    var top = elem.offsetTop;
    while (pNode) {
        top += pNode.offsetTop;
        pNode = pNode.offsetParent;
    }
    return top;
}

function getScroll(){
    return{
        top:document.documentElement.scrollTop||document.body.scrollTop,
        left:document.documentElement.scrollLeft||document.body.scrollLeft
    }
}
//去除字符串开始和结束的空格
function trim(str) {
    str = str.replace(/(^\s*)|(\s*$)/g, '');
    return str;
}
//和dom查找相关
var query = function(selectorText, pNode) {
    var regExps = {
        id: /^#([\w_\-]+)/,
        className: /^\.([\w_\-]+)/,
        tag: /^\w+$/,
        attribute: /(\w+)?\[([^=\]]+)(?:=(["'])?([^\]"']+)\3?)?\]/
    };
    var queryActions = {
        id: function(id, pNode) {
            var result = [];
            result.push(document.getElementById(id));
            return result;
        },
        tag: function(tag, pNode) {
            var curPNode = null;
            var result = [];
            if (pNode != undefined) {
                curPNode = pNode;
            } else {
                curPNode = document;
            }
            return curPNode.getElementsByTagName(tag);
        },
        className: function(className, parentNode) {
            var pNode = null;
            if (parentNode != undefined) {
                pNode = parentNode;
            } else {
                pNode = document;
            }
            var result = [];
            var elems = pNode.getElementsByTagName('*');
            ; i < elems.length; i++) {
                if (hasClass(elems[i], className)) {
                    result.push(elems[i]);
                }
            }
            return result;
        },
        attribute: function(tag, key, value, pNode) {
            var curPNode = null;
            if (pNode) {
                curPNode = pNode;
            } else {
                curPNode = document;
            }
            var elems = curPNode.getElementsByTagName(tag || '*');
            var result = [];
            ; i >= ; i--) {
                var curElem = elems[i];
                if (curElem.getAttribute(key)) {
                    if (!value) {
                        result.push(curElem);
                    } else {
                        if (curElem.getAttribute(key).toLowerCase() === value.toLowerCase()) {
                            result.push(curElem);
                        }
                    }
                }

            }
            return result;
        }
    };
    var fnName, regResult;
    var params = [];
    if (regResult = selectorText.match(regExps['id'])) {
        fnName = 'id';
        ]);
    }
    if (regResult = selectorText.match(regExps['tag'])) {
        fnName = 'tag',
            ]);
    }
    if (regResult = selectorText.match(regExps['className'])) {
        fnName = 'className',
            ]);
    }
    if (regResult = selectorText.match(regExps['attribute'])) {
        fnName = 'attribute',
            ], regResult[], regResult[]);
    }
    if (pNode) {
        params.push(pNode);
    }
    var elemResult = queryActions[fnName].apply(null, params);
    return elemResult;
};

tool.js

二、Base.js 调用tool.js,效果类似于一个轻量级的jquery

//前台调用
function $(args) {
    return new Base(args);
}

function Base(args) {
    this.elements = [];

    if (typeof args === 'string') {
        //说明是css选择符
        args = trim(args);
        var selectors = [];
        ) {
            selectors = args.split(/\s+/);
        } else {
            //说明选择符不具有层次关系,为了方便处理,依旧将其转换为数组
            selectors.push(args);
        }
        var pNodes = [];
        var childNodes = [];
        ; i < selectors.length; i++) {
            var curSelector = selectors[i];
            ) {
                pNodes.push(document);
            }
            childNodes = [];
            ; j < pNodes.length; j++) {
                var temps = query(curSelector, pNodes[j]);
                ; k < temps.length; k++) {
                    childNodes.push(temps[k]);
                }
            }
            pNodes = childNodes;
        }
        this.elements = childNodes;
    } else if (typeof args === 'object') {
        //说明传入的是dom对象,或者this
        if (args != undefined) {
            ] = args;
        }
    } else if (typeof args === 'function') {
        this.ready(args);
    }
}

//页面加载函数,类似于jquery的$(document).ready
Base.prototype.ready = function(fn) {
    addDomLoaded(fn);
};
//获取某一个节点,返回的是DOM节点对象
Base.prototype.getElem = function(num) {
    return this.elements[num];
};
//返回符合条件的首个DOM节点对象
Base.prototype.first = function() {
    ];
};
//返回符合条件的最后一个DOM节点对象
Base.prototype.last = function() {
    ];
};
//返回当前节点的上一个同级节点,返回的是Base对象
Base.prototype.next = function() {
    ; i < this.elements.length; i++) {
        this.elements[i] = this.elements[i].nextSibling;
        if (this.elements[i] == null) {
            throw new Error('找不到下一个同级节点!');
        }
        ) {
            this.next();
        }
    }
    return this;
};
Base.prototype.prev = function() {
    ; i < this.elements.length; i++) {
        this.elements[i] = this.elements[i].previousSibling;
        if (this.elements[i] == null) {
            throw new Error('找不到上一个同级节点!');
        }
        ) {
            this.prev();
        }
    }
    return this;
};

//获取某一个节点,返回的是Base对象
Base.prototype.eq = function(num) {
    var element = this.elements[num];
    this.elements = [];
    ] = element;
    return this;
};
Base.prototype.css = function(attr, value) {
    , len = this.elements.length; i < len; i++) {
        ) {
            return getStyle(this.elements[i], attr);
        }
        this.elements[i].style[attr] = value;
    }
    return this;
};
//获取长度
Base.prototype.len = function() {
    return this.elements.length;
};
Base.prototype.addClass = function(className) {
    , len = this.elements.length; i < len; i++) {
        if (!hasClass(this.elements[i], className)) {
            this.elements[i].className += ' ' + className;
        }
    }
    return this;
};
Base.prototype.removeClass = function(className) {
    , len = this.elements.length; i < len; i++) {
        if (hasClass(this.elements[i], className)) {
            this.elements[i].className = this.elements[i].className.replace(new RegExp('(\\s+|^)' + className + '(\\s+|$)'), ' ');
        }
    }
    return this;
};
//获取或者设置innerHTML
//潜在问题,如果是赋值的话,所有都赋值,如果是取值的话,貌似只是返回首个值
Base.prototype.html = function(htmlText) {
    , len = this.elements.length; i < len; i++) {
        ) {
            return this.elements[i].innerHTML;
        } else {
            this.elements[i].innerHTML = htmlText;
        }

    }
    return this;
};
//添加link或者style的css规则,不常用
Base.prototype.addRule = function(num, selectorText, cssText, position) {
    var sheet = document.styleSheets[num];
    insertRule(sheet, selectorText, cssText, position);
    return this;
};
//删除link或者style的css规则,不常用
Base.prototype.removeRule = function(num, index) {
    var sheet = document.styleSheets[num];
    deleteRule(sheet, index);
    return this;
};
//设置元素显示
Base.prototype.show = function() {
    ; i >= ; i--) {
        this.elements[i].style.display = 'block';
    };
    return this;
};
//设置元素隐藏
Base.prototype.hide = function() {
    ; i >= ; i--) {
        this.elements[i].style.display = 'none';
    };
    return this;
};
//检查元素是否处于隐藏状态
Base.prototype.isVisible = function() {
    var flag=true;
    ; i >= ; i--) {
        var curElem=this.elements[i];
        if(curElem.style.display=='none'||curElem.style.visibility=='hidden'){
            flag=false;
        }
    };
    return flag;
};
//设置已知宽度和高度的物体,在整个视图窗口居中
//前提:当前元素position:absolute,父元素是body对象
Base.prototype.screenCenter = function(width, height) {
    var viewSize = getViewSize();
    var left, top;

    , len = this.elements.length; i < len; i++) {
        var curElem = this.elements[i];
        ) {
            left = (viewSize.width - width) / ;
            top = (viewSize.height - height) / ;
        } else {
            //没有传入元素的宽和高,就自己获取
            left = (viewSize.width - curElem.offsetWidth) / ;
            top = (viewSize.height - curElem.offsetHeight) / ;
        }
        this.elements[i].style.top = top + 'px';
        this.elements[i].style.left = left + 'px';
    };
    return this;
};

//浏览器大小调整事件,可以用任意$()对象调用
Base.prototype.resize = function(fn) {
    addEvent(window, 'resize', fn);
    //window.onresize = fn;
    return this;
};
//设置hover事件
Base.prototype.hover = function(over, out) {
    , len = this.elements.length; i < len; i++) {
        //this.elements[i].onmouseover = over;
        addEvent(this.elements[i], 'mouseover', over);
        //this.elements[i].onmouseout = out;
        addEvent(this.elements[i], 'mouseout', out);
    };
    return this;
};
//toggle:点击切换方法,可以传递多个函数作为参数,执行完一轮则从头开始执行
Base.prototype.toggle = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        var args = arguments;
        //最终方法,这样的话每一个元素都具有单独的一个count计数器,并且不会产生诸如curElem.count这样的属性污染
        (function(curElem, args) {
            ;
            addEvent(curElem, 'click', function() {
                args[count++ % args.length].call(this);
            });

        })(curElem, args);
        //方法二:可以解决方法一的问题,但是依旧不行,因为如果选择器选择的是多个元素的话,公用一个count对象,可能会出现问题
        // addEvent(curElem, 'click', function() {
        //     //注意,在函数内定义函数,这是一个闭包
        //     //闭包可以访问外部函数的变量,但是保存的永远是外部函数变量的最后取值
        //     //因此这里count的取值才能始终累加
        //     //不是增添多次click事件,并且每次click事件的执行函数事实上都不相同
        //     args[count++ % args.length].call(this);
        // });
        //方法一:这种方式是不行的,执行的永远是第一个函数
        //addEvent(curElem,'click',args[count++%args.length]);
    }
    return this;
};

function tog(curElem, args) {
    ;
    addEvent(curElem, 'click', function() {
        args[count++ % args.length].call(this);
    });

}
//添加点击事件
Base.prototype.click = function(fn) {
    ; i < this.elements.length; i++) {
        addEvent(this.elements[i], 'click', fn);
    }
    return this;
};
//插件入口
Base.prototype.extend = function(name, fn) {
    Base.prototype[name] = fn;
};
Base.prototype.find = function(selector) {
    var pNodes = this.elements;
    this.elements = [];
    ; i < pNodes.length; i++) {
        var tmps = query(selector, pNodes[i]);
        ; j < tmps.length; j++) {
            this.elements.push(tmps[j]);
        }
    }
    return this;
};

//调用方法$().animate(styles,speed,callback,easing);
//styles:必选,如{width:100px}目前支持,top,left,width,height,opacity
//speed 可选,默认动画的速度,每多长时间执行一次,默认为30ms
//step 每一次动画执行步长,默认为10像素
//callback:动画执行之后的回调
//easing:动画速度的缓动函数,默认匀速
Base.prototype.animate = function(styles, callback, speed, step, easing) {
    function setValue(curElem, attr, nowValue) {
        curElem.style[attr] = (attr == ) : nowValue + 'px');

        if (attr == 'opacity') {
            curElem.style.filter = 'opacity(alpha=' + nowValue + ')';
        }
        document.getElementById('content').innerHTML += attr + ':' + getStyle(curElem, attr) + '</br>';
    }
    var finalValue, startValue, nowValue;
    ;
    ;
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        if (curElem.timer) {
            clearInterval(curElem.timer);
        }
        var temp = [];
        for (var attr in styles) {
            //每一组都有startValue,finalValue
            startValue = (attr ==  : parseInt(getStyle(curElem, attr)));
            finalValue = (attr ==  : parseInt(styles[attr]));
            step = (startValue < finalValue ? step : -step);
            temp.push([attr, startValue, step, finalValue]);
            //将各项值都复原,第二次动画的时候貌似不能复原了。。。
            setValue(curElem, attr, startValue);
        }
        curElem.timer = setInterval(function() {
            var flag = true; //判断是否所有的动画都已经结束,除了初始化的这次,如果为true,代表所有动画都结束
            ; i < temp.length; i++) {
                attr = temp[i][];
                nowValue = temp[i][];
                step = temp[i][];
                finalValue = temp[i][];
                 && finalValue <= nowValue + step) || (step <  && finalValue >= nowValue + step)) {
                    //应当所有的动画都执行完毕,才能清除掉计时器
                    //   clearInterval(curElem.timer);
                    nowValue = finalValue;
                    setValue(curElem, attr, finalValue);

                } else {
                    nowValue += step;
                    setValue(curElem, attr, nowValue);
                }
                temp[i][] = nowValue;
                if (nowValue != finalValue) {
                    flag = false;
                }
            };
            if (flag) {
                clearInterval(curElem.timer);
                if (callback) {
                    callback.call(curElem);
                }
            }
        }, speed);
    };

    return this;
};

Base.prototype.fadeIn = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];

        $(curElem).animate({

        });
    };
    return this;
};
Base.prototype.fadeOut = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        $(curElem).animate({

        });
    };
    return this;
};
Base.prototype.slideUp = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];

        if (getStyle(curElem, 'display') != 'none') {
            var startHeight = getStyle(curElem, 'height');
            $(curElem).animate({

            }, function() {
                $(this).hide().css('height', startHeight);
                //console.log(getStyle(this,'height'));
            });
        }

    };
    return this;
};
Base.prototype.slideDown = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        //console.log(getStyle(curElem,'display'));
        if (getStyle(curElem, 'display') == 'none') {
            var startHeight = getStyle(curElem, 'height');
            $(curElem).css('height', '0px').show().animate({
                'height': startHeight
            });
        }

    };
    return this;
};
//设置绑定事件方法

Base.prototype.bind = function(type, fn) {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        addEvent(curElem, type, fn);
    };
    return this;
};
//设置focus事件
Base.prototype.focus = function(fn) {
    this.bind('focus', fn);
};
//设置blur事件
Base.prototype.blur = function(fn) {
    this.bind('blur', fn);
};
//获得或者设置表单元素的value
Base.prototype.val = function(curValue) {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        if (curValue) {
            curElem.value = curValue;
        } else {
            return curElem.value;
        }
    }
    return this;
};
Base.prototype.attr = function(attr, value) {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        if (value == undefined) {
            return curElem.getAttribute(attr);
        } else {
            curElem.setAttribute(attr, value);
        }
    }
    return this;
};
//在之前插入元素
Base.prototype.insertBefore = function(elem) {
    , len = this.elements.length; i < len; i++) {
        var curElem = this.elements[i];
        var pNode = elem.parentNode;
        pNode.insertBefore(curElem, elem);
    }
    return this;
};
Base.prototype.insertAfter = function(elem) {
    , len = this.elements.length; i < len; i++) {
        var curElem = this.elements[i];
        var pNode = elem.parentNode;
        if (pNode.lastChild === elem) {
            pNode.appendChild(curElem);
        } else {
            pNode.insertBefore(curElem, elem.nextSibling);
        }
    }
    return this;
};

//获取元素的高度
Base.prototype.top = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        return getElementTop(curElem);
    };
};
Base.prototype.left = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        return getElementLeft(curElem);
    };
};
Base.prototype.width = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        return curElem.offsetWidth;
    };
};
Base.prototype.height = function() {
    ; i < this.elements.length; i++) {
        var curElem = this.elements[i];
        return curElem.offsetHeight;
    };
};

base.js

三、Base_drag.js基于Base.js的拖拽插件

//将拖拽封装为库
$().extend('drag', function() {
    var tags=arguments;
    for (var i = 0; i < this.elements.length; i++) {
        var curElem = this.elements[i];
         addEvent(curElem, 'mousedown', function(e) {
             var diffX = e.clientX - getElementLeft(this);
             var diffY = e.clientY - getElementTop(this);
             var that = this;
             //限定只有点击部分区域才可以拖动
             var flag = false;
             for (var j = 0; j < tags.length; j++) {
                 if (e.target.tagName.toLowerCase() == tags[j].toLowerCase()) {
                     flag = true;
                     break;
                 }
             }

             function move(e) {
                 var left = e.clientX - diffX;
                 var top = e.clientY - diffY;
                 //如果超出了当前视图边缘则禁止脱宅
                 if (left < 0) {
                     left = 0;
                 }
                 if (top < 0) {
                     top = 0;
                 }
                 var viewSize = getViewSize();
                 if (left > viewSize.width - that.offsetWidth) {
                     left = viewSize.width - that.offsetWidth;
                 }
                 if (top > viewSize.height - that.offsetHeight) {
                     top = viewSize.height - that.offsetHeight;
                 }
                 that.style.left = left + 'px';
                 that.style.top = top + 'px';
             }

             function up(e) {
                 removeEvent(document, 'mousemove', move);
                 removeEvent(document, 'mouseup', up);
             }
             if (flag) {
                 addEvent(document, 'mousemove', move);
                 addEvent(document, 'mouseup', up);
             }
         });
    }
});

Base_drag.js

四、Base_screenlock.js 基于Base.js的锁屏插件

//javascript锁屏插件
$().extend('lock', function() {
    var viewSize = getViewSize();
    for (var i = this.elements.length - 1; i >= 0; i--) {
        var curElem = this.elements[i];
        curElem.style.width = viewSize.width + 'px';
        curElem.style.height = viewSize.height + 'px';
        curElem.style.display = 'block';
    };
    document.documentElement.style.overflow = 'hidden';
    return this;
});
$().extend('unlock', function() {
    for (var i = 0; i < this.elements.length; i++) {
        this.elements[i].style.display = 'none';
    };
    document.documentElement.style.overflow = 'auto';
    return this;
});

Base_screenlock.js

轻量级的jquery的更多相关文章

  1. sDashboard:简单的,轻量级的 jQuery 仪表板插件

    sDashboard 是一个轻量的仪表板 jQuery 插件,转换一个对象数组到仪表板.数组中的每个对象将被呈现为一个仪表板组件,可以通过左右拖 ​动重新排列. sDashboards 内置渲染 Da ...

  2. 轻量级实用JQuery表单验证插件:validateForm5

    表单验证是Web项目一个必不可少的环节,而且是一项重复的劳动,于是小菜封装了一款简单的表单验证插件,名字叫:validateForm5. validateForm5插件基于Jquery,并向HTML5 ...

  3. webui-popover 一个轻量级的jquery弹出层插件

    该提示框插件可以和Bootstrap完美结合,但是并不一定需要和Bootstrap一起使用.它支持IE7以上的浏览器. 首先要引入需要的css  js  文件 <link rel="s ...

  4. jQuery国际化插件 jQuery.i18n.properties 【轻量级】

    jQuery.i18n.properties是一款轻量级的jQuery国际化插件,能实现Web前端的国际化. 国际化英文单词为:Internationalization,又称i18n,“i”为单词的第 ...

  5. 50个jQuery插件可将你的网站带到另一个高度

    Web领域一直在发生变化并且其边界在过去的每一天都在发生变化(甚至不能以小时为计),随着其边界的扩展取得了许多新发展.在这些进步之中,开发者的不断工作创造了更大和更好的脚本,这些脚本以插件方式带来更好 ...

  6. 40 个让你的网站更加友好的 jQuery 插件

    一个插件的基本功能是执行一个含有元素集合的函数数组.每个方法和jQuery核心组成一个插件,如.fadeOut()或.addClass().一个jQuery插件是一个基本的可以扩充jQuery 原型对 ...

  7. 迷你版jQuery——zepto核心源码分析

    前言 zepto号称迷你版jQuery,并且成为移动端dom操作库的首选 事实上zepto很多时候只是借用了jQuery的名气,保持了与其基本一致的API,其内部实现早已面目全非! 艾伦分析了jQue ...

  8. 40个让你的网站屌到爆的jQuery插件

    一 个插件的基本功能是执行一个含有元素集合的函数数组.每个方法和jQuery核心组成一个插件,如.fadeOut()或.addClass().一个 jQuery插件是一个基本的可以扩充jQuery 原 ...

  9. 最新的jQuery插件和JavaScript库

    每一个前端开发人员很清楚的重要性和功能的JavaScript库提供.它提供了一个简单的接口,用于构建快速动态的接口,而无需大量的代码. 谢谢你的超级从事jQuery开发者社区,人始终是创造新的和令人惊 ...

随机推荐

  1. 用ultraISO 制作一个MSdos启动软盘镜像

    见过软盘,但是没用过,在虚拟机里试试. 磁带,软盘,光盘,硬盘…… 储存介质一代代更新,看到的img.iso文件都是叫做镜像文件(image file ).image 即图片照片,所谓的image f ...

  2. SiteMesh装饰器使用总结

    SiteMesh是一个Java WEB项目的网页布局和修饰框架.使用SiteMesh后就不再需要在每个页面中都用<jsp:include>标签引入页头.页尾.导航等其他公用页面了. 可以将 ...

  3. Maven 创建多模块工程

    1. 创建父项目 new -->project-->maven-->maven Project,然后下一步, 进入new maven Project的Select project n ...

  4. Vertex Fetch Texture (VTF)

    http://www.opengl.org/wiki/Vertex_Texture_Fetch Vertex Texture Fetch     This article contains inacc ...

  5. Linux 计划任务 Crontab 笔记与总结(5)crontab 常见错误与案例

    ① 环境变量 cd ~ pwd 就会到你登陆的那个用户的根目录下 ls -a 能够查看到 .bash_profile 这个文件 vim .bash_profile 这里面设置了一些环境变量. 可以设置 ...

  6. Visual Studio解决方案及项目的配置

    配置解决方案的属性 1.配置解决方案平台,该配置实际上修改的是解决方案目录下的sln(solution)文件. 配置项目的属性 1.配置项目平台及项目的目标平台:项目-右键-属性-生成(竖着第二个选项 ...

  7. 挑战python

    00 热身 http://www.pythonchallenge.com/pc/def/0.html import math print math.pow(2,38); # 274877906944 ...

  8. Bootstrap页面布局2 - 包含BS文件

    如图所示: bootstrap布局基于HTML5,为了使IE8以下也能使用某些HTML5的标签,必须要引入文件:http://html5shiv.googlecode.com/svn/trunk/ht ...

  9. Smarty 配置文件的读取

    http://www.cnblogs.com/gbyukg/archive/2012/06/12/2539067.html

  10. laravel 部分路由取消csrf

    // app/Http/Middleware/VerifyCsrfToken protected $except = [ 'webhook/*' ];