Web 页对话框，可拖动，可自动关闭

2024-09-05 12:18:30

字体：大中小

来源：转载

供稿：网友

由Js实现的网页WEB对话框，鼠标可随意拖动改变位置，类似于有些软件初次运行时候弹出的每日提示，里面有文字在循环变化，时间到自动关闭。

<title>Web 页对话框</title><style>span,table{font-size:10pt;margin:0pt}</style><body onmousemove=move1()><table id=table1 bordercolorlight=#d8d0c8 bordercolordark=#808080 border=2 style=display:block;position:absolute;width:400;height:257;left:100;top:50;background-color:#c0c0c0;><tr><td style=vertical-align:top><span id=span1 onselectstart="return false" style=cursor:nw-resize;width:400;background-color:#002468 onmousedown=down1() onmouseup=up1() style=color:white> Tip of the day -- Web 页对话框<span style=width:157;height:8;background:#002468></span><span id=x style=color:black;background:#d8d0c8;width:18;height:8;vertical-align:middle;text-align:center;padding:0;margin:2;cursor:hand;border-style:outset;border-width:2 onclick=closewin()>X</span></span><br><span style=width:10;background-color:#c0c0c0;height:160></span><span id=span2 style=border-style:solid;border-width:1;border-color:#808080;width:60;background-color:#808080;height:160><br>  <b><font color=white style=cursor:help onclick='alert("大家随便拿去用哦^o^")'>帮助</font></b><br><br><br><br><br><br><br><br><span style=color:white; id=num>  1/5</span></span><span style=border-style:solid;border-width:1;border-color:#808080;width:320;background-color:white;height:60;position:absolute;><br><h3><b>  你知道吗...</b></h3></span><span id=call style=border-style:solid;border-width:1;border-color:#808080;width:320;background-color:white;height:100;text-align:center;><br><span id=message style=width:270;height:70;background:white>大家好，我是dennisboys</span></span><br><br><span>  <input id=check1 type=checkbox checked onclick=checkone() onfocus=this.blur()> 自动翻帖</span><span style=width:155;height:20;background:#c0c0c0></span><span><input type=button value="下一帖" style=background-color:#c0c0c0 onclick=nextmsg() onfocus=this.blur()></span><span><input type=button value="关闭" style=background-color:#c0c0c0 onfocus=this.blur() onclick=closewin()></span></td></tr></table></body><script> var i=1var timer1var msg=new Array();msg[0]=""msg[1]="大家好，我是dennisboys"msg[2]="我非常喜欢javascript"msg[3]="51js真是一个非常好的地方"msg[4]="我以后会常来的"msg[5]="就说到这吧，886" function nextmsg(){num.innerText="  "+i+"/5"message.innerText=msg[i]i++if(i>5)i=1clearTimeout(timer1)check1.checked=false} function checkone(){if(check1.checked==true) { num.innerText="  "+i+"/5" message.innerText=msg[i] i++ if(i>5)i=1 timer1=setTimeout("checkone()",2000) }else{clearTimeout(timer1)}} checkone() var count=0function down1(){cleft=table1.style.pixelLeftctop=table1.style.pixelTopcx=event.clientXcy=event.clientYcount=1} function move1(){if(count==1) {table1.style.pixelLeft=cleft+event.clientX-cx table1.style.pixelTop=ctop+event.clientY-cy}} function up1(){count=0} function closewin(){table1.style.display='none'} </script>

上一篇：Js实现可控制的移动窗口

下一篇：iphone手机桌面效果