鼠标拖动写字，网页特效

2024-09-05 12:22:23

字体：大中小

来源：转载

供稿：网友

拖动鼠标实现写字效果。按住鼠标左键不放，在页面中拖动即可写字 ; 同时按住ctrl和鼠标左键不放，在页面中拖动即可把字擦去，挺有意思的效果，大家共享哈。

<!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>鼠标拖动写字</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>

上一篇：网页十字线，跟着鼠标的十字交叉线，像瞄准星

下一篇：跟随鼠标的心

学习交流

如何查找有故障的配件

如何查找有故障的配件...

热门图片

猜你喜欢的新闻

猜你喜欢的关注