位置：首页>> 网络编程>> JavaScript>> 爱你就要说出来，来表白吧

爱你就要说出来，来表白吧

　来源：经典论坛　发布时间：2008-11-23 16:23:00　

标签：特效,写字,工具

在蓝色看到的这个程序，不错！

by：thornyzhl

前天看到有个人写了能在网页中写字的程序,找不到了,我来个能擦写的....

蛮有意思的阿.~

呵呵。。。用来表白的好东西！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>念，写给你的哦 - asp之家</title><style type="text/css">* { -moz-user-select:none; border:0px;}#tips { width:850px; padding-top:8px; padding-bottom:8px; background:#999999; color:#FFFFFF; text-align:center; margin:auto; font-size:14px;}</style><script type="text/javascript">var Is_Mouse_Down = falsevar Is_First=1function Create(evt){ evt=evt?evt:window.event if(Is_Mouse_Down){ if(evt.ctrlKey){ Clean(evt) } else { Write(evt) } }}function Write(evt){ evt=evt?evt:window.event var Obj_Nian=document.createElement("DIV") Obj_Nian.style.position="absolute" Obj_Nian.style.left=evt.clientX-10+"px" Obj_Nian.style.top=evt.clientY-10+"px" switch(Is_First){ case 1:Obj_Nian.innerHTML="刘";break; case 2:Obj_Nian.innerHTML="念";break; case 3:Obj_Nian.innerHTML="我";break; case 4:Obj_Nian.innerHTML="喜";break; case 5:Obj_Nian.innerHTML="欢";break; case 6:Obj_Nian.innerHTML="你";break; default:Obj_Nian.innerHTML="Error";break; } Is_First+=1 if(Is_First==7){ Is_First=1 } Color_Nian="RGB("+Math.floor(Math.random()*100)+"％,"+Math.floor(Math.random()*100)+"％,"+Math.floor(Math.random()*100)+"％)" Obj_Nian.style.color=Color_Nian document.body.appendChild(Obj_Nian)}function Clean(evt){ evt=evt?evt:window.event evt.srcObj=evt.srcElement?evt.srcElement:evt.target if(evt.srcObj.tagName=="DIV" && (evt.srcObj.innerHTML=="刘" || evt.srcObj.innerHTML=="念" || evt.srcObj.innerHTML=="我" || evt.srcObj.innerHTML=="喜" || evt.srcObj.innerHTML=="欢" || evt.srcObj.innerHTML=="你")){ evt.srcObj.innerHTML="" }}document.onmousedown=function(){Is_Mouse_Down=true}document.onmousemove=Createdocument.onmouseup=function(){Is_Mouse_Down=false}</script></head><body onselectstart="javascript:return false"><div id="tips">提示：按住鼠标左键不放，在页面中拖动即可写字 ; 同时按住ctrl和鼠标左键不放，在页面中拖动即可把字擦去</div></body></html>

改进版演示，支持自定义显示的文字：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>我爱asp之家</title><style type="text/css">* { -moz-user-select:none; border:0px;}#tips { width:850px; padding-top:8px; padding-bottom:8px; background:#999999; color:#FFFFFF; text-align:center; margin:auto; font-size:14px; z-index:100; position:relative;}.dd{ z-index:1;}</style><script type="text/javascript">var Is_Mouse_Down = falsevar Is_First=0var d="我爱asp之家！"var p= new Array();for(var i=0;i<d.length;i++){ p[i]=d.substring(i,i+1);}function changtxt(){ var dd=document.getElementById("changetxt").value; d=dd; for(var i=0;i<d.length;i++){ p[i]=d.substring(i,i+1); }}function Create(evt){ evt=evt?evt:window.event if(Is_Mouse_Down){ if(evt.ctrlKey){ Clean(evt) } else { Write(evt) } }}function Write(evt){ evt=evt?evt:window.event var Obj_Nian=document.createElement("DIV") Obj_Nian.style.position="absolute"; Obj_Nian.className="dd"; Obj_Nian.style.left=evt.clientX-10+"px" Obj_Nian.style.top=evt.clientY-10+"px" Obj_Nian.innerHTML=p[Is_First] Is_First+=1 if(Is_First==d.length){ Is_First=0 } Color_Nian="RGB("+Math.floor(Math.random()*100)+"％,"+Math.floor(Math.random()*100)+"％,"+Math.floor(Math.random()*100)+"％)" Obj_Nian.style.color=Color_Nian document.body.appendChild(Obj_Nian)}function Clean(evt){ evt=evt?evt:window.event evt.srcObj=evt.srcElement?evt.srcElement:evt.target if(evt.srcObj.className=="dd"){ document.body.removeChild(evt.srcObj); }}document.onmousedown=function(){Is_Mouse_Down=true}document.onmousemove=Createdocument.onmouseup=function(){Is_Mouse_Down=false}</script></head><body onselectstart="javascript:return false"><div id="tips"> <p>提示：按住鼠标左键不放，在页面中拖动即可写字 ; 同时按住ctrl和鼠标左键不放，在页面中拖动即可把字擦去</p> <input type="text" name="changetxt" id="changetxt" /> <input type="button" name="" id="" onclick="changtxt()" value="修改背景文字" /></div></body></html>

使用说明：支持自定义显示文字，在地址后加上?你想说话

如：

http://www.aspxhome.com/love.htm?我爱你

http://www.aspxhome.com/love.htm?美女喜欢你

问好后面是什么文字就显示什么，来表白吧!

效果截图：

投稿

爱你就要说出来，来表白吧

猜你喜欢