webkitTransitionに薄皮かぶせる。

(function(){
    var camelize = function(str){
        return str.replace(/-+(.)?/g,function(match,chr){
            return chr ? chr.toUpperCase():'';
        })
    };
    var getPrefixedObject = function(prefix,obj){
        var ret = {};
        Object.keys(obj).forEach(function(p){
            ret[prefix+p] = obj[p];
        });
        return ret;
    };
    var prefixed = function(prop){
        if( /^transition/.test(prop) )
            return 'webkit-' + prop;
        if( /^transform/.test(prop) )
            return 'webkit-' + prop;
        return prop;
    };
    this.setStyle = function(styleObject){
        var _self = this;
        Object.keys(styleObject).forEach(function(p){
            _self.style[camelize(prefixed(p))] = styleObject[p];
        });
        return this;
    };
    this.getStyle = function(name){
        return this.style[camelize(prefixed(name))];
    };
    this.from = this.setStyle;
    this.to = function(styleObject){
        var _self = this;
        setTimeout(function(){
            _self.setStyle(styleObject);
        },0);
        return this;
    };
    this.after = function(cb){
        var transitionTime = parseFloat(this.getStyle('transition-duration'))*1000;
        var _self = this;
        setTimeout(function(){cb.apply(_self)},transitionTime);
    }
}).apply(HTMLElement.prototype);

    var overlay = $('overlay');
    overlay.from({
        "display" : 'block',
        "height"  : (window.innerHeight)+ 'px',
        "opacity" : 0,
        "transition-duration" : '1s'
    }).to({
        "opacity":0.5
    });