最新-一款鼠标跟随特效代码精品

合集下载

【网页特效代码-鼠标特效】鼠标随移动的方向而改变

<html xmlns:v="urn:schemas-microsoft-com:vml"><STYLE>body{margin:0px;cursor:url(/jscode/images/Select.cur)}v\:* { Behavior: url(#default#VML) }</STYLE><script>var trace=""var vPvar r=0var vSvar p=new Object()var lineColor=[[255,0,0],[255,0,255]]p.x=0;p.y=0function init(){document.body.onmousedown=function(){if (event.button==1 || event.button==4){if (event.button==1) vP=document.createElement("v:PolyLine"); else vP=document.createElement("v:line");}vS=document.createElement("v:stroke")vP.filled="false"vP.appendChild(vS)document.body.appendChild(vP)trace="";if (event.button==4) vP.from.value=event.clientX + "," + event.clientY; }document.body.onmousemove=function(){if (event.button==1){pos=event.clientX + "," + event.clientY + " ";trace+=posvS.color="rgb(255,0,0)"vP.points.value=trace}if (event.button==4) {vP.to.value=event.clientX + "," + event.clientY;}rImg.style.left=event.clientX-20;rImg.style.top=event.clientY-20;var cX = p.x-event.clientX;var cY = p.y-event.clientY;if (cX || cY) {status ="cX:"+cX+" -cY:"+cYrotationImg(180-parseInt(Math.atan2(cY,cX)*180/Math.PI,10));}p.x=event.clientX;p.y=event.clientY;}document.body.onmouseup=function(){vS.EndArrow="Block"}document.onselectstart=function(){return false}}function rotationImg(flag){window.status=r + " to " + flag;var step=3;while(r-flag>180) flag+=360while(flag-r>180) flag-=360r += (flag-r)/steprImg.style.rotation=90-r;}</script><body onload="init()"><v:image id="rImg" src="/teixiao/UploadFiles_4612/200802/20080224102453174.gif" style="position:absolute;top:0;left:0;width:37;height:37;0" ><v:Stroke dashstyle="Solid"/></v:image></body>。

鼠标跟随特效代码

鼠标跟随代码物体对鼠标的跟随可以采用在帧上添加as语句starDrag的方法来实现。

但是采用这种方法所实现的跟随过程太生硬，跟得实在是紧，也就是当鼠标移动到别的位置，物体也很快的移动了过来，假如要让物体慢慢（速度可以控制）的靠近鼠标，使用starDrag 这条语句就不能做到。

starDrag语句的功能其实是和下面的代码相同的。

onClipEvent (enterFrame) { xTarget = _root._xmouse; yTarget = _root._ymouse; _x = xTarget; _y = yTarget;}这几行代码是添加在物体（影片剪辑）上面的。

其中，语句_x = xTarget 和_y = yTarget的作用是使物体的坐标定位到（xTarget，yTarget）上，而（xTarget，yTarget）就是鼠标的当前坐标。

修改这几行代码，就可以使物体在鼠标移动后，慢慢的靠近鼠标。

_x = xTarget 等价于_x = xTarget + _x - _x（加一个减一个）即：_x =_x + （xTarget - _x）其中的（xTarget - _x）是物体的目标位置与当前位置的坐标差如果让（xTarget - _x）乘上一个小于1的系数，那么物体就不会突然移动到坐标（xTarget，yTarget）上，而是慢慢的靠过去。

于是，修改后的代码如下：onClipEvent (enterFrame) { xTarget = _root._xmouse; yTarget = _root._ymouse; fraction=0.5; _x = _x + (xTarget-_x)fraction; _y = _y + (yTarget-_y)fraction; }实现了慢慢靠近对“慢慢靠近”的加以利用：一个跟一个场景上放置一个影片剪辑，instance name命名为darg0在帧上添加代码：copies = 5;for (var i = 1; i=copies; i++) { duplicateMovieClip (drag0, drag+i, i); (drag+i).num = i;}上面的代码复制了5个，drag1～drag5，连同drag0，场景上共6个其中，还给drag1～drag5定义了内部变量drag1.num～drag5.num在场景上的drag0上面添加代码：onClipEvent (enterFrame) { if (num) { xTarget = (_root.drag+(num-1))._x; yTarget =(_root.drag+(num-1))._y; } else { xTarget = _root._xmouse; yTarget = _root._ymouse; } fraction = .5; _x += (xTarget-_x)fraction; _y += (yTarget-_y)fraction;}这几行代码使得drag0跟随着鼠标，drag1跟随着drag0，drag2跟随着drag1，……，drag5跟随着drag4解释一下if这个判断语句因为drag1.num～drag5.num的值都不为空，所以对于drag1～drag5这5个影片剪辑，执行的代码是：xTarget = (_root.drag+(num-1))._x;yTarget = (_root.drag+(num-1))._y;也就是跟随着前一个而对于drag0，由于没有给它定义num，它的值为空，所以对于drag0，执行的代码是：xTarget = _root._xmouse;yTarget = _root._ymouse;也就是跟随着鼠标“一个跟一个”代码的另一种写法上面的“一个跟一个”的制作，是在场景上只放置了一个影片剪辑，然后在影片剪辑上添加as代码，再通过在帧上添加as代码（duplicateMovie）来复制影片剪辑。

js实现鼠标跟随运动效果

js实现⿏标跟随运动效果⿏标跟随运动效果展⽰1、使⽤命令创建基本结构ul.cursorPlay#cursorPlay>li*12>a>img+div>span2、给span标签添加字段3、设置基本的样式1、cursorPlay的宽度 992px，⾼度600px2、cursorPlay li背景为⽩⾊，内边距为8px，外边距5px,显⽰浮动为左浮动3、cursorPlay li a,cursorPlay li a img显⽰为块状并且为相对布局4、cursorPlay li a添加overflow:hidden5、cursorPlay li a div为绝对布局，宽度和⾼度均为100%，设置背景颜⾊为rgba4、js添加动态效果（⽅向0,1,2,3分别为上，右，下，左）1）、给绑定⿏标进⼊或者出去的事件$("#cursorPlay li").on("mouseenter mouseleave",function(event){var evType = event.type;var direction = getDir($(this), {x: event.pageX,y: event.pageY});// console.log("evtype:"+evType+",dir:"+direction);moveTo($(this),direction, evType);});2、2）、使⽤getDir获取⿏标移动的⽅向，coordinates坐标计算⿏标划⼊画出⽅向函数（搜索关键词“jquery计算⿏标划⼊划出⽅向”）direction = Math.round((((Math.atan2(y, x) * (180 / Math.PI)) + 180) / 90) + 3) % 4;function getDir($el, coordinates){var w = $el.width(),h = $el.height(),x = (coordinates.x - $el.offset().left - (w / 2)) * (w > h ? (h / w) : 1),y = (coordinates.y - $el.offset().top - (h / 2)) * (h > w ? (w / h) : 1),direction = Math.round((((Math.atan2(y, x) * (180 / Math.PI)) + 180) / 90) + 3) % 4;return direction;}3）、添加移动函数moveTo，三个参数分别为选择器，⽅向，⿏标划⼊画出类型，通过判断⿏标划⼊类型，来⾃定义选择器初始位置，然后重定义css样式，当⿏标划出时再重定义每个⽅向上的位置function moveTo($el, direction, type){var $layer = $el.find("div");var coord = {};if(type === "mouseenter"){switch(direction){case 0 : $layer.css("top","-100%").css("left","0px");break;case 1 : $layer.css("left","100%").css("top","0px");break;case 2 : $layer.css("top","100%").css("left","0px");break;case 3 : $layer.css("left","-100%").css("top","0px");break;}coord = {left:0,top:0}}else{switch(direction){case 0 : coord = {left:0,top:'-100%'};break;case 1 : coord = {left:'100%',top:0};break;case 2 : coord = {left:0,top:'100%'};break;case 3 : coord = {left:'-100%',top:0};break;}}$layer.animate(coord,300);}以上就是本⽂的全部内容，希望对⼤家的学习有所帮助，也希望⼤家多多⽀持。

一款鼠标跟随特效代码

一款鼠标跟随特效代码篇一：网页制作特效——鼠标特效代码网页制作特效——鼠标特效说明：选择下列特效中的一种，选择其中蓝色的部分，粘贴在html的之间，预览效果。

(一)时钟环绕鼠标之间-->dCol="0000FF"fCol="FF0000"sCol="00FF00"mCol="000000"hCol="000000"ClockHeight=40;ClockWidth=40;ClockFromMouseY=0;ClockFromMouseX=100;d=new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");m=new Array("1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月");date=new Date();day=date.getDate();year=date.getYear();if (year TodaysDate="年 "+m[date.getMonth()]+" "+day+"日"+d[date.getDay()]+" "+year; D=TodaysDate.split('');H='...';H=H.split('');M='....';M=M.split('');S='.....';S=S.split('');Face='1 2 3 4 5 6 7 8 9 10 11 12'; font='Arial';size=1;speed=0.6;ns=(yers);ie=(document.all);Face=Face.split(' ');n=Face.length;a=size*10;ymouse=0;xmouse=0;scrll=0;props="";props2="";Split=360/n;Dsplit=360/D.length;HandHeight=ClockHeight/4.5 HandWidth=ClockWidth/4.5HandY=-7;HandX=-2.5;scrll=0;step=0.06;currStep=0;y=new Array();x=new Array();Y=new Array();X=new Array();for (i=0; i Dy=new Array();Dx=new Array();DY=new Array();DX=new Array();for (i=0; i if (ns){for (i=0; i document.write(''+props2+D[i]+'');for (i=0; i document.write(''+props+Face[i]+'');for (i=0; i document.write(''+S[i]+'');for (i=0; i document.write(''+M[i]+'');for (i=0; i document.write(''+H[i]+'');}if (ie){document.write('');for (i=0; i document.write(''+props2+D[i]+'');document.write('');document.write(' style="position:relative">');for (i=0; i document.write(''+props+Face[i]+'');document.write('');document.write('');for (i=0; i document.write(''+H[i]+'');document.write('');document.write('');for (i=0; i document.write(''+M[i]+'');document.write('')document.write('');for (i=0; i document.write(''+S[i]+'');document.write('')}(ns)?window.captureEvents(Event.MOUSEMOVE):0;function Mouse(evnt){ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY; xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX;}(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;function ClockAndAssign(){time = new Date ();secs = time.getSeconds();sec = -1.57 + Math.PI * secs/30;mins = time.getMinutes();min = -1.57 + Math.PI * mins/30;hr = time.getHours();hrs = -1.575 + Math.PI *hr/6+Math.PI*parseInt(time.getMinutes())/360;if (ie){Od.style.top=window.document.body.scrollTop;Of.style.top=window.document.body.scrollTop;Oh.style.top=window.document.body.scrollTop;Om.style.top=window.document.body.scrollTop;Os.style.top=window.document.body.scrollTop;}for (i=0; i varF=(ns)?yers['nsFace'+i]:ieFace[i].style;F.top=y[i] + ClockHeight*Math.sin(-1.0471 +i*Split*Math.PI/180)+scrll;F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180);}for (i=0; i varHL=(ns)?yers['nsHours'+i]:ieHours[i].style;HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll;HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs);}for (i=0; i varML=(ns)?yers['nsMinutes'+i]:ieMinutes[i].style;ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll;ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min);}for (i=0; i varSL=(ns)?yers['nsSeconds'+i]:ieSeconds[i].style;SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll;SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec);}for (i=0; i varDL=(ns)?yers['nsDate'+i]:ieDate[i].style;DL.top=Dy[i] +ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll; DL.left=Dx[i] +ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180); } currStep-=step;}function Delay(){scrll=(ns)?window.pageYOffset:0;Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed);for (i=1; i Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed);Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);}y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);for (i=1; i y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);}ClockAndAssign();setTimeout('Delay()',40);}if (ns||ie)window.onload=Delay;//-->(二)很酷的跟随鼠标的三色彩带之间-->var a_Colour='fff000';var b_Colour='00ff00';var c_Colour='ff00ff';var Size=120;var YDummy=new Array(),XDummy=newArray(),xpos=0,ypos=0,ThisStep=0;step=0.6; if (yers){ window.captureEvents(Event.MOUSEMOVE);function nsMouse(evnt){xpos = window.pageYOffset+evnt.pageX+6;ypos = window.pageYOffset+evnt.pageY+16;}window.onMouseMove = nsMouse;}else if (document.all){function ieMouse(){xpos = document.body.scrollLeft+event.x+6;ypos = document.body.scrollTop+event.y+16;}document.onmousemove = ieMouse;}function swirl(){for (i = 0; i 篇二：简单的网页鼠标跟随代码放入标签中就OKhtml {overflow: hidden;}body {position: absolute; height: 100%;width: 100%;margin:0;padding:0;}#screen {background:#000;position: absolute; width: 100%;height: 100%;}#screen span { background: #fff;font-size: 0;overflow: hidden;width: 2px;height: 2px;}var Follow = function () {var $ = function (i) {return document.getElementById(i)},addEvent = function (o, e, f) {o.addEventListener ?o.addEventListener(e, f, false) : o.attachEvent('on'+e,function(){f.call(o)})},OBJ = [], sp, rs, N = 0, m;var init = function (id, config) {this.config = config || {};this.obj = $(id);sp = this.config.speed || 4;rs = this.config.animR || 1;m = {x: $(id).offsetWidth * .5, y: $(id).offsetHeight * .5};this.setXY();this.start();}init.prototype = {setXY : function () {var _this = this;addEvent(this.obj, 'mousemove', function (e) {e = e || window.event;m.x = e.clientX;m.y = e.clientY;})},start : function () {var k = 180 / Math.PI, OO, o, _this = this, fn = this.config.fn;OBJ[N++] = OO = new CObj(null, 0, 0);for(var i=0;i var O = OO;for(var j=10; j var x = fn(i, j).x,y = fn(i, j).y;OBJ[N++] = o = new CObj(O , x, y);O = o;}}setInterval(function() {for (var i = 0; i }, 16);}}var CObj = function (p, cx, cy) {var obj = document.createElement("span");this.css = obj.style;this.css.position = "absolute";this.css.left = "-1000px";this.css.zIndex = 1000 - N;document.getElementById("screen").appendChild(obj); this.ddx = 0;this.ddy = 0;this.PX = 0;this.PY = 0;this.x = 0;this.y = 0;this.x0 = 0;this.y0 = 0;this.cx = cx;this.cy = cy;this.parent = p;}CObj.prototype.run = function () {if (!this.parent) {this.x0 = m.x;this.y0 = m.y;} else {this.x0 = this.parent.x;this.y0 = this.parent.y;}this.x = this.PX += (this.ddx += ((this.x0 - this.PX - this.ddx) + this.cx) / rs) / sp; this.y = this.PY += (this.ddy += ((this.y0 - this.PY - this.ddy) + this.cy) / rs) / sp; this.css.left =Math.round(this.x) + 'px';this.css.top = Math.round(this.y) + 'px';}return init;}();new Follow('screen', {speed: 4,animR : 2,fn : function (i, j) {return {x : j/4*Math.cos(i),y : j/4*Math.sin(i)}}})篇三：Flash常见的鼠标跟随效果[Flash常见的鼠标跟随效果flash中的鼠标可以更有个性些，做起来也不算复杂，比如把鼠标指针换成你喜欢的样子，或让鼠标指针有一个灵动飘逸的跟随，如下图中的效果，怎么样？动手试试：一、例１：让鼠标指针变变样：把鼠标变成上面第一个图的样子，当然你爱咋样子的都行，比如一个字，一种形状，一张图片都行。

常用的网页特效代码【VIP专享】

常用的网页特效代码1．文本向上循环滚动说明:文本自动向上循环滚动，鼠标放到上面还会暂时停下来。

果:代码:2．页面自动滚屏效果<body onLoad="scrollit()"><SCRIPT language="JavaScript"> </SCRIPT>3．滚动的文字说明说明鼠标放到链接上就会出现一个说明框，里面有滚动的文字说明效果把鼠标放上来试试代码4．飘动的字符跟随鼠标说明在鼠标后面跟着一串飘动的字符效果看看就知道啦！Array代码5．一群小点跟随鼠标说明跟随鼠标的一群小点，就象星星一样效果看看就知道啦！代码6．接触链接自动打开窗口说明鼠标放到链接上，就立刻弹出警告框效果试试代码7．数字时钟说明数字化的时钟效果现在时刻：12:07:54代码8．显示停留的时间说明显示他人在页面停留的时间，而且可以作出提醒效果代码9．有影子的数字时钟说明这个时钟是有影子的，而且还在不停地走着呢效果12:09:3612:09:36代码10．打字效果说明:文字在状态栏上从左往右一个一个地显示，就象你打出的字一样效果:看看状态栏！Array代码:11．文字不停闪烁说明:一段文字在状态栏上不停跳动显示，可以作为提示信息效果:看看状态栏！代码:12．图象大小自动变化说明: 把一张图片变形扭曲成各种不同的长宽，非常好玩效果:代码:13．漫天飞雪说明: 漫天飞雪效果: 看到了吗？代码:14．自由移动的图片(一)说明:自由移动的图片效果:看到了吗？代码:再把<body>改为：15．自由移动的图片(二)说明: 图片在页面内随意飘动，遇到边界还会反弹。

效果: 看到了吗？代码:16．状态栏里的动态欢迎语说明浏览器的状态栏里出现一个字接一个字往左跑的欢迎语！效果看看状态栏：）代码17．背景色变换按钮:18．去掉超链接的下划线说明有时候看着那超链接的下划线挺讨厌的，把下面这段代码放到网页源代码<head>与</head>之间，下划线就无影无踪啦！注意，网页的<body>标签里不能再有link之类的属性，否则本效果会失效！效果试试就知道啦！代码19．给页面加保护说明如果你不想让辛辛苦苦做出来的东西被人轻易地Copy&Paste走的话，不妨在HTML里加入下面这段代码。

flash鼠标跟随

Flash鼠标跟随简介Flash是一种常用的多媒体技术，可以创建动画、游戏和交互式应用程序。

在Flash中，鼠标跟随是一种常见的交互效果，它可以使对象或元素在鼠标移动时进行相应的移动。

在本文中，我们将学习如何使用Flash来实现鼠标跟随效果。

我们将介绍基本的思路和步骤，并给出示例代码帮助你更好地理解。

实现步骤步骤1：创建一个新的Flash项目首先，你需要创建一个新的Flash项目。

打开Flash软件，点击“文件”菜单，选择“新建”来创建一个新的项目。

步骤2：添加元件在Flash项目中，你可以使用元件来创建和管理图形、动画和其他对象。

我们将添加一个元件来实现鼠标跟随效果。

点击菜单栏上的“插入”按钮，选择“新建元件”。

在弹出的对话框中，选择一个合适的元件类型，比如影片剪辑(Symbol)。

步骤3：设置鼠标跟随1.将创建的元件拖动到舞台上。

2.在舞台上，选中该元件，然后点击顶部的“属性”面板。

3.在属性面板中，找到“动画”选项卡，并点击“创建新的动画”，创建一个新的动画帧序列。

4.在舞台上的元件中，选中第1帧，在顶部的“属性”面板中，找到“动作”选项卡。

5.在“动作”选项卡中，选择“鼠标”并勾选“跟随”。

步骤4：设置对象的移动现在，当鼠标在舞台上移动时，元件将跟随鼠标进行移动。

但是，通常我们希望元件有一定的平滑移动效果。

1.在舞台上，选中元件的第1帧，在属性面板中选择“动作”选项卡。

2.在“动作”选项卡中，选择“脚本”并输入以下代码：onEnterFrame = function () {this._x += ( _xmouse - this._x ) / 10;this._y += ( _ymouse - this._y ) / 10;}以上代码创建了一个onEnterFrame函数，它在每一帧都会执行。

函数中的代码计算了元件的新位置，并使用简单的缓动效果让元件平滑地跟随鼠标移动。

步骤5：导出并测试最后一步是导出Flash项目并测试鼠标跟随效果。

【网页特效代码-鼠标特效】疯狂攻击鼠标

}
}
function Split(){
Clrs=new Array('fff000','ffffff','ffa500')
var ntscp=yers,msie=document.all;
if (yers){
for (i = 0; i < amount; i++)
{
if (i < amount-1)
{ntscp['nsa'+i].top=ntscp['nsa'+(i+1)].top;ntscp['nsa'+i].left=ntscp['nsa'+(i+1)].left}
else
{ntscp['nsa'+i].top=divTop;ntscp['nsa'+i].left=divLeft}
function nsMouse(evnt){
xpos=evnt.pageX;ypos=evnt.pageY;
}
window.onMouseMove = nsMouse;
}
else if (document.all){
document.write('<div style="position:absolute;top:0px;left:0px">');
bomb();
else
{
if ((divLeft > xpos-speed/1.5) && (divLeft < xpos+speed/1.5) && (divTop >= ypos-speed/1.5) && (divTop <= ypos+speed/1.5))

jQuery实现炫酷的鼠标轨迹特效

jQuery实现炫酷的⿏标轨迹特效代码：复制代码代码如下:<!DOCTYPE html><html xmlns="/1999/xhtml"><head><title>jQuery实现炫酷的⿏标轨迹特效</title><base target="_blank" /><script type="text/javascript"> window.onload = function () {C = Math.cos; S = Math.sin; U = 0; w = window; j = document; d = j.getElementById("kele"+"yi_com"); c = d.getContext("2d"); W = d.width = w.innerWidth; H = d.height = w.innerHeight; c.fillRect(0, 0, W, H); c.globalCompositeOperation = "lighter"; c.lineWidth = 0.2; c.lineCap = "round"; var bool = 0, t = 0; d.onmousemove = function (e) {if (window.T) {if (D == 9) { D = Math.random() * 15; f(1); }clearTimeout(T);}X = e.pageX; Y = e.pageY; a = 0; b = 0; A = X, B = Y; R = (e.pageX / W * 999 >> 0) / 999; r = (e.pageY / H * 999 >> 0) / 999; U = e.pageX / H * 360 >> 0; D = 9; g = 360 * Math.PI / 180; T = setInterval(f = function (e) {c.save(); c.globalCompositeOperation = "source-over"; if (e != 1) { c.fillStyle = "rgba(0,0,0,0.02)"; c.fillRect(0, 0, W, H); }c.restore(); i = 25; while (i--) {c.beginPath(); if (D > 450 || bool) {if (!bool) { bool = 1; }if (D < 0.1) { bool = 0; }t -= g; D -= 0.1;}if (!bool) { t += g; D += 0.1; }q = (R / r - 1) * t; x = (R - r) * C(t) + D * C(q) + (A + (X - A) * (i / 25)) + (r - R); y = (R - r) * S(t) - D * S(q) + (B + (Y - B) * (i / 25)); if (a) { c.moveTo(a, b); c.lineTo(x, y) }c.strokeStyle = "hsla(" + (U % 360) + ",100%,50%,0.75)"; c.stroke(); a = x; b = y;}U -= 0.5; A = X; B = Y;}, 16);}j.onkeydown = function (e) { a = b = 0; R += 0.05 }d.onmousemove({ pageX: 300, pageY: 290 })}</script><style>body{margin:0;overflow:hidden}div{padding:1px 5px;background:#333;position:absolute;z-index:2;color:#555;font-family:arial}a{color:#ccf}a:hover{color:red}</style></head><body><div id="text"></div><canvas id="keleyi_com"></canvas></body></html>以上就是本⽂的内容了，希望⼩伙伴们喜欢此特效，快过年了，给⾃⼰的个⼈主页增添些⾊彩吧。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

一款鼠标跟随特效代码
篇一：网页制作特效——鼠标特效代码网页制作特效——鼠标特效说明：选择下列特效中的一种，选择其中蓝色的部分，粘贴在的之间，预览效果。

(一)时钟环绕鼠标之间-->(二)很酷的跟随鼠标的三色彩带之间-->篇三：常见的鼠标跟随效果[常见的鼠标跟随效果中的鼠标可以更有个性些，做起来也不算复杂，比如把鼠标指针换成你喜欢的样子，或让鼠标指针有一个灵动飘逸的跟随，如下图中的效果，怎么样？动手试试：一、例１：让鼠标指针变变样：把鼠标变成上面第一个图的样子，当然你爱咋样子的都行，比如一个字，一种形状，一张图片都行。

过程：1)插入一个元件，类型为影片剪辑，自己动手画个形状吧，像上面图一那样的也行，这不要紧，要紧的是在元件编辑视图下，要将这个图形的左上角对准中心的十字，否则鼠标定位时会有误差，如图：[小技巧：直接在舞台上绘图，完成后全选并右击，选择“转换为元件——影片剪辑——确定”，这样做影片剪辑，会自动对齐。

]2)把影片剪辑放到舞台上，实例名为：_3)在帧上加代码，非常简单：_();(_,);(){_=;_=;}();其中();的作用是隐藏默认的鼠标指针，如果要恢复显示：();二、例２：鼠标指针后面跟随飘逸的枫叶：过程：1）把这几张图下载到你的电脑上，并导入到库中去。

2）把这些图拖到舞台上去，按图从小到大的顺序依次分别右击他们，并选“转换成元件——影片剪辑——确定”：按“从小到大”的顺序操作，是为了叠放次序，后来居上：虽然在同一时间轴图层上，但后转换成影片剪辑的会居上方。

3）同样从小到大，依次取实例名为：0、1、2、3、4、54）在帧上加一些简单的代码即可：0();(_,);(){0=+20;0=+10;=3;(=1; 但这个例子，想和大家一起用代码方式做，代码如下，不理解也没关系，复制到第一帧上，可以改一改跟随文字，比如把“打倒日本帝国主义”改成“钓鱼岛是中国的固有领土”，呵呵：*************************从这里复制开始**************************************_="打倒日本帝国主义";=0;=();(; （二）绘制星星：1）插入一个元件，类型为“图形”，确定后进入到元件编辑状态下，适当放大视图，然后进行绘图。

2）画一个无线框圆，白色，透明度33%，再调成纵向窄条；画一个无边线六边形，白色，透明66%，拽一拽上下两个顶点，让它们不那么冒尖，然后再调成窄条；再制一个窄条，透明度调成100%，即不透明。

将三个窄条组合，调整长短、宽窄，然后叠起来；最后再复制一下，叠成十字形状，如下图：3）画三个圆，无边线，白色，透明分别为33%、66%、100%，再将它们组合、重叠起来，调整好大小位置，如图：4）将十字和圆圈叠起来，调好适当大小位置，并组合；将组合图中心点对齐到“十”字上，大小设为16*16像素，一个小星星，如图：（三）制作星星播放动画：1）插入一个元件，类型为“影片剪辑”，进入到元件编辑视图下，在第一帧上，将刚才做好星星拖入，中心点对齐到中间“十”字上。

2）在第10帧上插入一个关键帧，将星星轴下调130像素，旋转90度，并与第一帧之间创建补动画。

3）在时间轴上，再添加四个图层，分别为“图层2到图层5”，再将“图层1”已经做好的帧分别复制粘贴到这四个图层上，如下图左：4）由下往上，将各图层第一帧上的星星透明度分别调整为20%、40%、60%、80%、100%，最后一帧上的星星透明度都调为0%全透明。

5）再如上图右边那样，将各图层的第一层和最后一帧的位置拖动到适当的位置上6）图层1的最后一帧（第30帧）添加代码()，即播放到最后停止。

（四）添加类：在库中找到刚才做好的动画影片剪辑元件，“右击——链接”，如图勾选两个选项，“类”后面输入：_，基类保留默认。

（五）在主场景第一帧中加入代码：(_,);=0;(){(%3==0){__=_();_=;_=;(_);}++;。