链接类

VML

按钮类

标题类

表单类

表格类

菜单类

窗口类

对象类

滚动条

键盘类

框架类

例子类

模拟类

日期类

色彩类

鼠标类

数学类

图片类

文字类

下拉框

样式类

游戏类

状态栏

资料类

字幕类

其它类

 ·onmousewhe...
 ·鼠标移动测试
 ·鼠标形状
 ·拖动页面
 ·鼠标形状
 ·跟着鼠标的图形
 ·拖动页面
 ·很酷的鼠标效果
 ·坐标
 ·拖动图层
您当前位置:好素材首页 -> 网页特效 -> 鼠标类
查看信息

录制的鼠标路径
好素材网 www.HaoSc.com 02月22日 11:49

[查看演示]  源码如下
----------------------------------------------------------
<HTML>
<HEAD>
<TITLE> New Document -www.51windows.Net</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">

<script language="JavaScript">
<!--
var mousex=new Array();
var mousey=new Array();
var i;
var j=0;
var k;
var recordcount=0;
var repeat;
var repeat2;
var repeat3;
var speed=50;

function startthis() {
recordcount=1;
i=0;
mousex=new Array();
mousey=new Array();
recordthis();
}

function recordthis() {
if (maxnum.value=='' || isNaN(maxnum.value) == true || maxnum.value<0) {
if (recordcount==1) {
mousex[i]=mousefollow.offsetLeft;
mousey[i]=mousefollow.offsetTop;
i++;
k=i;
textfield.value='无时间限制';
}
}
else {
if (recordcount==1) {
if (i<maxnum.value) {
mousex[i]=mousefollow.offsetLeft;
mousey[i]=mousefollow.offsetTop;
i++;
k=i;
textfield.value='剩余'+(maxnum.value-i)+'/50秒';
}
else {
recordcount=0;
textfield.value='时间到';}
}
}
repeat=setTimeout("recordthis()",20);
}

function stopthis() {
clearTimeout("repeat");
recordcount=0;
}

function playthis() {
clearTimeout("repeat");
clearTimeout("repeat3");
recordcount=0;
if (j<i-1) {
arrow.style.pixelLeft=mousex[j];
arrow.style.pixelTop=mousey[j];
arrow.style.visibility='visible';
j++;
repeat2=setTimeout("playthis()",speed);
}
else {clearTimeout("repeat2");
arrow.style.visibility='hidden';
j=0;
}
}

function rewindthis() {
clearTimeout("repeat");
clearTimeout("repeat2");
recordcount=0;
if (k>0) {
arrow.style.pixelLeft=mousex[k-1];
arrow.style.pixelTop=mousey[k-1];
arrow.style.visibility='visible';
k--;
repeat3=setTimeout("rewindthis()",speed);
}
else {clearTimeout("repeat3");
arrow.style.visibility='hidden';
k=i;
}
}

function follow() {
mousefollow.style.pixelLeft=document.body.scrollLeft+event.clientX;
mousefollow.style.pixelTop=document.body.scrollTop+event.clientY;
}
// -->
</script>
<link rel="stylesheet" href="test.css" type="text/css">
</HEAD>

<BODY onmousemove=follow()>
<div id="arrow" style="position:absolute; width:12px; height:21px; z-index:1;visibility:hidden"><img src="jsimg/cursor.gif" ></div>
<div id="mousefollow" style="position:absolute; width:12px; height:21px; z-index:1;visibility:hidden">.</div>
<input type="text" name="maxnum" size="4" maxlength="4"><input type=button onclick=startthis() value=录制><input type=button onclick=stopthis() value=停止><input type=button onclick="speed=50;playthis()" value=播放><input type=button onclick="speed=2;playthis()" value=快放><input type=button onclick="speed=150;playthis()" value=慢放><input type=button onclick="speed=50;rewindthis()" value=倒放><input type="button" name="textfield" style="width:100px" value="无时间限制">
</BODY>
</HTML>

<div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand">
<input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div>


此信息共 1 页 [1]