$(function(){

var dilog=$('#dilog');

var dilogTitle=$('#dilog_title');

var closeButton=$('.close_button');

var mark=$('#mark');

var showDilog=$('.showDilog');

var current=false;

var moveX;

var moveY;

//自動居中函數(shù)

function autoCenter(el){

var elX=($(window).width()-el.width())/2;

var elY=($(window).height()-el.height())/2;

el.css({'left':elX+'px','top':elY+'px'});

}

//覆蓋全屏函數(shù)

function filltoBody(el){

el.css({'width':'100%','height':'100%'});

}

//鼠標事件1：當鼠標點下去的時候

dilogTitle.on('mousedown',function(e){

var mouseX=e.pageX;

var mouseY=e.pageY;

moveX=mouseX-dilog.offset().left;

moveY=mouseY-dilog.offset().top;

current=true;

})

//鼠標事件2：當鼠標移動的時候

dilogTitle.on('mousemove',function(e){

var nowX=0;

var nowY=0;

if(current===true)

{

var nowX=e.pageX-moveX;

var nowY=e.pageY-moveY;

nowX=Math.min($(window).width()-dilog.width(),Math.max(0,nowX));

nowY=Math.min($(window).height()-dilog.height(),Math.max(0,nowY));

dilog.css({'left':nowX+'px','top':nowY+'px'});

}

})

//鼠標事件3：當鼠標松開的時候

? ? $(document).on('mouseup',function(){

? ? current=false;

? ? })

? ??

? ? //點擊顯示

? ? showDilog.on('click',function(){

? ? dilog.css('display','block');

? ? mark.css('display','block');

? ? autoCenter(dilog);

? ? filltoBody(mark);

? ? })

? ??

? ? //關閉按鈕

? ? closeButton.on('click',function(){

? ? dilog.css('display','none');

? ? mark.css('display','none');

? ? })

? ??

? ? //窗口變化

? ? $(window).resize(function(){

? ? autoCenter(dilog);

? ? filltoBody(mark);

? ? })

})