点击页面上的按纽，弹出一个层，背景变灰点击页面上的按纽，弹出一个层，背景变灰
bgobj.setattribute( 'id ', 'bgdiv '); bgobj.style.position=absolute; bgobj.style.top= 0; bgobj.style.background= #777 ; bgobj.style.filter= progid:dximagetransform.microsoft.alpha(style=3,opacity=25,finishopacity=75 ; bgobj.style.opacity= 0.6; bgobj.style.left= 0; bgobj.style.width=swidth + px; bgobj.style.height=sheight + px; bgobj.style.zindex = 10000; document.body.appendchild(bgobj);//在body内添加该div对象 var msgobj=document.createelement( div)//创建一个div对象（提示框层） //定义div属性，即相当于 //
msgobj.setattribute( id, msgdiv); msgobj.setattribute( align, center); msgobj.style.background= white ; msgobj.style.border= 1px solid ; msgobj.style.position = absolute; msgobj.style.left = 50%; msgobj.style.top = 50%; msgobj.style.font= 12px/1.6em verdana, geneva, arial, helvetica, sans-serif; msgobj.style.marginleft = -225px ; msgobj.style.margintop = -75+document.documentelement.scrolltop+ px; msgobj.style.width = msgw + px; msgobj.style.height =msgh + px; msgobj.style.textalign = center; msgobj.style.lineheight = 25px; msgobj.style.zindex = 10001; var title=document.createelement( h4);//创建一个h4对象（提示框标题栏） //定义h4的属性，即相当于 // 关闭 title.setattribute( id, msgtitle); title.setattribute( align, right); title.style.margin= 0; title.style.padding= 3px; title.style.background=bordercolor; title.style.filter= progid:dximagetransform.microsoft.alpha(startx=20, starty=20, finishx=100, finishy=100,style=1,opacity=75,finishopacity=100);; title.style.opacity= 0.75 ; title.style.border= 1px solid ; title.style.height= 18px ; title.style.font= 12px verdana, geneva, arial, helvetica, sans-serif; title.style.color= white; title.style.cursor= pointer; title.innerhtml= 关闭; title.onclick=removeobj; var button=document.createelement( input);//创建一个input对象（提示框按钮） //定义input的属性，即相当于 // button.setattribute( type, button); button.setattribute( value, 关闭); button.style.width= 60px; button.style.align= center; button.style.marginleft= 250px; button.style.marginbottom= 10px; button.style.background=bordercolor; button.style.border= 1px solid; button.style.color= white; button.onclick=removeobj; function removeobj() {//点击标题栏触发的事件 document.body.removechild(bgobj);//删除背景层div document.getelementbyid( msgdiv).removechild(title);//删除提示框的标题栏 document.body.removechild(msgobj);//删除提示框层 } document.body.appendchild(msgobj);//在body内添加提示框div对象msgobj document.getelementbyid( msgdiv).appendchild(title);//在提示框div中添加标题栏对象title var txt=document.createelement( p);//创建一个p对象（提示框提示信息） //定义p的属性，即相当于 // 测试效果
txt.style.margin= 1em 0 txt.setattribute( id , msgtxt); txt.innerhtml=str;//来源于函数调用时的参数值 document.getelementbyid( msgdiv).appendchild(txt);//在提示框div中添加提示信息对象txt document.getelementbyid( msgdiv).appendchild(button);//在提示框div中添加按钮对象button }
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]
注意style.position和style.zindex两属性。