layer

(function(w){
    
    function Layer(){
        
        this.init();
        
    }
    Layer.prototype.init=function(){
        
        if(document.getElementById(‘layer_oby‘)){//如果已经存在的情况
            
            this.oLayer=document.getElementById(‘layer_oby‘);
            
        }else{
            this.oLayer=document.createElement(‘div‘);
            this.oLayer.id=‘layer_oby‘;
        }
        Layer.prototype.init.prototype=Layer.prototype;
        return new init();
        
    }
    Layer.prototype.msg=function(msg,time){//消息提示
        var self=this;
        var time=time===undefined?2000:time;//默认两秒钟后消失
        this.oLayer.innerHTML=msg;
        
        //添加内容后才设置样式
        
        document.body.appendChild(this.oLayer);
        this.oLayer.style.display=‘none‘;
        this.oLayer.style.opacity=‘0‘;
        this.setCss();
        
        Layer.tool.opacityMove(0,1,this.oLayer,function(){
            
            setTimeout(function(){
                Layer.tool.opacityMove(1,0,self.oLayer,function(){
                    self.oLayer.style.display=‘none‘;
                    self.oLayer.parentNode.removeChild(self.oLayer);
                });
            },time);
        });
        
    }
    Layer.prototype.alert=function(msg){
        var self=this;
        
        this.oLayer.innerHTML=msg;
        //添加内容后才设置样式
        
        document.body.appendChild(this.oLayer);
        
        this.setCss();
        
        this.setClose();
        
        this.oLayer.addEventListener(‘click‘,function(ev){
            
            if(ev.target.id==‘close_oby‘){
                
                self.oLayer.style.display=‘none‘;
                
            }
        });
    }
    Layer.prototype.setClose=function(){//设置关闭按钮
        
        this.closeBtn=document.createElement(‘span‘);
        this.closeBtn.innerHTML=‘ב;
        this.closeBtn.id=‘close_oby‘;
        this.oLayer.appendChild(this.closeBtn);
        
        //设置样式
        this.closeBtn.style.position=‘absolute‘;
        this.closeBtn.style.top=‘10px‘;
        this.closeBtn.style.right=‘10px‘;
        this.closeBtn.style.fontSize=‘22px‘;
        this.closeBtn.style.fontWeight=‘bold‘;
        this.closeBtn.style.cursor=‘pointer‘;
        
        
    }
    Layer.prototype.setCss=function(){//设置样式
        
        var currentWidth,currentHeight;
        
        this.oLayer.style.maxWidth=‘300px‘;
        this.oLayer.style.padding=‘20px 30px‘;
        this.oLayer.style.background=‘rgba(0,0,0,0.8)‘;
        this.oLayer.style.position=‘absolute‘;
        this.oLayer.style.color=‘#fff‘;
        this.oLayer.style.wordBreak=‘break-word‘;
        currentWidth=parseInt(Layer.tool.getStyle(this.oLayer,‘width‘));
        currentHeight=parseInt(Layer.tool.getStyle(this.oLayer,‘height‘));
        
        this.oLayer.style.marginLeft=-currentWidth/2+‘px‘;
        this.oLayer.style.marginTop=-currentHeight/2+‘px‘;
        this.oLayer.style.top=‘50%‘;
        this.oLayer.style.left=‘50%‘;
        
        
    }
    
    Layer.tool={
        getStyle:function(obj,attr){//获取当前样式
            return window.getComputedStyle(obj, null)[attr];
        },
        opacityMove:function(start,end,obj,callback){//透明度变化
            var start=start;
            var end=end;
            var step=start<end?0.2:-0.2;
            var timer=null;
            
            timer=setInterval(function(){
                start+=step;
                if((step>0&&start>end)||(step<0&&start<end)){
                    clearInterval(timer);
                    callback?callback():‘‘;
                }else{
                    obj.style.opacity=start;
                    
                }
                
                
                
            },100)
        }
    }
    w.layer=Layer;
    
})(window);