跟随鼠标飘动的文字。光线渐变。<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<!--
/*******************************Copyleft******************************************
Arkys Web Builder Toys :: Dreamweaver3 :: Flying fonts follow your mouse
Coder by Arky; data:2000-1-21;
mailto:arky@21cn.com; icq:17119978
for more tools, please visit http://cnlingo.yeah.net
*********************************************************************************/
//define message content
var message = "Loading......",bgcolor="99ccff";
message=message.split("");
var times=message.length;
//predefine preferences
var x,y,xspace,yspace,speed,colorv="EEEEEE";
var xpos=new Array(),ypos=new Array();
for (i=0;i<=times-1;i++)xpos[i]=-50;
for (i=0;i<=times.length-1;i++)ypos[i]=-50;
//predefine switchs
var flag=false,Pcolorstyle=3,runflag=true;
//predefine colorgraind
var cyclecolor=new Array(times),runcolor=new Array(times);
var keycolor=0,randkey=-1,basestep=0,keycstate=true;
function preset(xval,yval,spval,xreval,yreval){
xspace=xval*xreval;yspace=yval*yreval;speed=spval;
bgcolor=(document.bgColor.length == 7)?document.bgColor.substring(1,7):"ffffff";
makecolor();
}
function makecolor(){//make a color cycle
if (Pcolorstyle > 0){
hexa = new Array(16);
for(var i = 0; i < 10; i++)hexa[i] = i;hexa[10]="a"; hexa[11]="b"; hexa[12]="c";hexa[13]="d"; hexa[14]="e"; hexa[15]="f";
var alycolor=new Array(parseInt("0x"+colorv.substring(0,2)),parseInt("0x"+colorv.substring(2,4)),parseInt("0x"+colorv.substring(4,6)));
var alybgcolor=new Array(parseInt("0x"+bgcolor.substring(0,2)),parseInt("0x"+bgcolor.substring(2,4)),parseInt("0x"+bgcolor.substring(4,6)));
var colordelta=new Array((alycolor[0]-alybgcolor[0])/times,(alycolor[1]-alybgcolor[1])/times,(alycolor[2]-alybgcolor[2])/times);
for(i=0;i<times;i++){
var rgb1=alycolor[0]-colordelta[0]*i;
var rgb2=alycolor[1]-colordelta[1]*i;
var rgb3=alycolor[2]-colordelta[2]*i;
cyclecolor[i]="#"+hexa[Math.floor(rgb1/16)] + hexa[Math.floor(rgb1%16)]+hexa[Math.floor(rgb2/16)] + hexa[Math.floor(rgb2%16)]+hexa[Math.floor(rgb3/16)] + hexa[Math.floor(rgb3%16)];
}
}else for(i=0;i<times;i++)cyclecolor[i]="#"+colorv;
}
makecolor();
for (i=0;i<times;i++){
var towrit = "<span id=\"span"+i+"\" style=\" FONT-WEIGHT: bold; FONT-SIZE: 12pt; VISIBILITY: visible; COLOR:"+cyclecolor[i]+"; font-family:mono; POSITION: absolute; TOP: -50px \" >";
document.write(towrit);
document.write(message[i]);
document.write("</span>");
}
if (document.layers)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = handlerMM;
function AKmakesnake() { //make fly snake
if (Pcolorstyle >2){ //exchange color
for(i=0;i<times;i++)if(keycolor-i>-1)runcolor[keycolor-i]=(keycstate)?cyclecolor[i]:cyclecolor[times-i-1];
for(i=0;i<times;i++)if(keycolor+i<times)runcolor[keycolor+i]=(keycstate)?cyclecolor[i]:cyclecolor[times-i-1];
if(keycolor == times){
keycolor=0;
keycstate=(keycstate)?false:true;
}else keycolor++;
}
if(flag){
for (i=times-1; i>=1; i--) {
xpos[i]=xpos[i-1]+Math.abs(xspace);
ypos[i]=ypos[i-1];
}
if (runflag){
xpos[0]=x+xspace+basestep*2;
ypos[0]=y+yspace+basestep*2;
basestep += randkey;
if (Math.abs(basestep)>times/3)randkey=(randkey==1)?-1:1;
}else{
xpos[0]=x+xspace;
ypos[0]=y+yspace;
}
for (i=0; i<times; i++) {
var layerleft=(document.all)?eval("span"+(i)+".style.posLeft=xpos[i]"):("document.span"+i+".left=xpos[i]");
var layertop=(document.all)?eval("span"+(i)+".style.posTop=ypos[i]"):("document.span"+i+".top=ypos[i]");
if (Pcolorstyle >2)(document.all)?eval("span"+(i)+".style.color=runcolor[i]"):("document.span"+i+".color=runcolor[i]");
}
}
var timer=setTimeout("AKmakesnake()",speed)
}
function handlerMM(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX;
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY;
flag=true;
}
//-->
分享到:
相关推荐
在本文中,我们将深入探讨如何使用ActionScript 3(AS3)编程语言创建一个互动效果,使得小球跟随鼠标在舞台上飘动。ActionScript 3是Adobe Flash Professional和FlashDevelop等工具中的主要脚本语言,它为动画和...
根据给定的文件标题、描述、标签以及部分内容,本文将详细介绍一种特殊效果的时钟——“很酷的时钟(跟随鼠标飘动的双层时钟)”。此时钟不仅具备基本的时间显示功能,还拥有独特的动态效果:时钟会随着鼠标在网页上...
实现了随鼠标飘动的文字效果,文字可以用图片等代替!!!!
运用duplicate使雪花跟随鼠标 ,合理在动画中运用duplicate.适合基础人员。 雪花飘动。。跟随鼠标。通过实例讲解,更易于基础学习的人员学习,实例包含原代码。PDF文档中,包含对此代码的讲解。
这是用flash pro AS3.0写的文字跟随鼠标移动效果
在C#编程环境中,我们可以利用Windows Forms来实现“飘动的文字”效果,这通常涉及到图形绘制、动画控制以及用户交互等多个方面。以下是对这个主题的详细解析: 首先,我们需要创建两个窗体(Form1和Form2)。Form1...
js 特效 html 特效 文字飘动输出 js 特效 html 特效 文字飘动输出
js 特效 html 特效 飘动的漂亮文字 js 特效 html 特效 飘动的漂亮文字
JavaScript的运用可能包括添加事件监听器,比如用户点击某个按钮启动或停止文字飘动,或者根据时间间隔改变飘动速度或方向。此外,还可以用JavaScript动态生成飘动的文字,增加交互性。 对于初学者,理解这个实例...
在Web开发中,实现图片跟随鼠标移动效果是一个常见的互动效果,它能够提升用户体验,并让网页的互动性大大增强。本文将详细介绍使用JavaScript来实现图片跟随鼠标移动的具体方法。 首先,需要了解的是JavaScript的...
【CSS3悬停文字交叉飘动切换动画特效】 在网页设计中,动态效果常常能吸引用户的注意力并提升用户体验。CSS3悬停文字动画特效是一种创新的交互方式,它利用CSS3的强大功能,使得文本在鼠标悬停时呈现出丰富多彩的...
如何制作图片上飘动的文字 把这些代码复制上去就可以了。 图片地址> <MARQUEE scrollAmount=3 behavior=alternate width=500>
即时JS飘动窗口是一种网页交互效果,主要用于模拟QQ等即时通讯软件中的聊天窗口弹出和飘动的行为。这种效果能够吸引用户的注意力,并提供一种动态、友好的用户界面体验。通过JavaScript实现,它允许开发者在网页中...
在C#编程中,制作飘动动画窗体是一项有趣且实用的技术,它可以为用户界面增添动态效果,提高用户体验。在本教程中,我们将探讨如何利用C#实现一个窗体在屏幕上自由上下左右飘动的动画效果。 首先,我们需要了解...
这个基础的飘动功能可以让窗体随着鼠标的移动而移动,但若要实现更复杂的飘动效果,如QQ那样平滑的动画效果,可能需要引入定时器并使用更精细的坐标计算,以确保窗口移动的平滑性。 此外,有时候我们可能需要阻止...
其次,"飘动文字"是一种动态效果,能够吸引用户的注意力,增加页面的趣味性。这通常是通过JavaScript实现的,利用定时器和CSS动画来控制文本的动态显示,例如滑动、闪烁或者随机移动。了解如何运用JavaScript操作DOM...
此外,为了使飘动的窗体更具交互性,可以添加鼠标事件监听,当用户点击或靠近窗体时,窗体可以暂停飘动,或者根据用户的鼠标操作改变飘动的方向和速度。 最后,标签中的“JAVA”可能意味着开发者也对Java有所了解。...
在本案例中,我们关注的是"文字飘动输出"的JavaScript特效,它能够为网页增加引人入胜的视觉体验,使得文字如同在屏幕上飘动般呈现。 这种效果通常通过JavaScript操纵HTML元素的位置和样式来实现。HTML元素,如`<p>...
开发者可能使用了鼠标事件(如MouseMove或MouseDown)来捕捉用户的输入,然后在每次事件触发时改变窗体的位置,模拟出飘动的效果。 例如,开发者可能在鼠标按下时记录鼠标位置,然后在鼠标移动时更新窗体位置。为了...
在这个"OpenGL实现飘动效果"的项目中,我们将探讨如何利用OpenGL来模拟红旗或其他物体的动态飘动效果。 飘动效果的实现主要依赖于动画原理和物理学概念,如风力、重力和物体的物理属性。在OpenGL中,我们通常通过...