div弹出效果
来源:广州中睿信息技术有限公司官网
发布时间:2012/10/21 23:25:16 编辑:editor 阅读 389
现在流行的div弹出效果<html><head><metahttp-equiv="Content-Type"content="text/htmlchars

现在流行的div弹出效果

 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
 
<title>弹出特效</title>
 
<script>
var falpha
falpha=0
function fchange(){
if (falpha!=90){
        table1.style.filter="alpha(opacity="+falpha+")";
        falpha=falpha+10;
        setTimeout("fchange()",200)
        }
else { falpha=0;
    }
}
function sss(){        
        table1.style.height=(window.document.body.clientHeight>window.document.body.scrollHeight)?window.document.body.clientHeight:window.document.body.scrollHeight;
        table1.style.width="100%";
        table1.style.display='block'
        table2.style.left=window.document.body.scrollWidth/2-100;
        table2.style.top=window.document.body.offsetHeight/2-100
        table2.style.display='block'
        fchange()
}

 

function freset(){
table1.style.display='none'
table2.style.display='none'
}

 

</script>

 


 

 

<script language="javascript" type="text/javascript">
<!--
var ie=document.all
var ns6=document.getElementById&&!document.all

 

var dragapproved=false
var z,x,y

 

function move(e){
if (dragapproved){
z.style.left=ns6? temp1+e.clientX-x: temp1+event.clientX-x
z.style.top=ns6? temp2+e.clientY-y : temp2+event.clientY-y
return false
}
}

 

function drags(e){
if (!ie&&!ns6)
return
var firedobj=ns6? e.target : event.srcElement
var topelement=ns6? "HTML" : "BODY"

 

while (firedobj.tagName!=topelement&&firedobj.className!="table2"){
firedobj=ns6? firedobj.parentNode : firedobj.parentElement
}

 

if (firedobj.className=="table2"){
dragapproved=true
z=firedobj
temp1=parseInt(z.style.left+0)
temp2=parseInt(z.style.top+0)
x=ns6? e.clientX: event.clientX
y=ns6? e.clientY: event.clientY
document.onmousemove=move
return false
}
}
document.onmousedown=drags
document.onmouseup=new Function("dragapproved=false")

 

//-->
</script>
</head>

 

<body>

 

<div id="table1" style=" background:#FFFFFF; display: none; position: absolute;z-index:1;filter:alpha(opacity=40)" oncontextmenu="return false">
 
</div>

 

<div class="table2" id="table2" style="position:absolute; onmousedown=MDown(table2);background:#CCCCCC; display:none; z-index:2; width:300; height:200; border-left:solid #000000 1px; border-top:solid #000000 1px; border-bottom:solid #000000 1px; border-right:solid #000000 1px; cursor:move;" cellspacing="0" cellpadding="0" oncontextmenu="return false">
 <input type="button" onClick="freset()" value='确定'> <input type="button" onClick="freset()" value='取消'>
 
</div>

 


<center>
<input name="button" type="button" onClick="sss()" value='申请提交'>
</center>
 
 

</body>
</html>

 

联系我们CONTACT 扫一扫
愿景:成为最专业的软件研发服务领航者
中睿信息技术有限公司 广州•深圳 Tel:020-38931912 务实 Pragmatic
广州:广州市天河区翰景路1号金星大厦18层中睿信息 Fax:020-38931912 专业 Professional
深圳:深圳市福田区车公庙有色金属大厦509~510 Tel:0755-25855012 诚信 Integrity
所有权声明:PMI, PMP, Project Management Professional, PMI-ACP, PMI-PBA和PMBOK是项目管理协会(Project Management Institute, Inc.)的注册标志。
版权所有:广州中睿信息技术有限公司 粤ICP备13082838号-2