Web design.

Цветные искорки кружатся вокруг курсора.

Код:
--------------------------------------------------------------------------------------------------------------
<script language="JavaScript">
if (document.all){
with (document){
write('<div id="starsDiv" style="position:absolute;top:0px;left:0px">')
write('<div style="position:relative;width:1px;height:1px;background:#ffffff;
font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#fff000;
font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#ffa000;
font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#ff00ff;
font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#00ff00;
font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#0000ff;
font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:1px;height:1px;background:#FF0000;
font-size:1px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#ffffff;
font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#fff000;
font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#ffa000;
font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#ff00ff;
font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#00ff00;
font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:2px;height:2px;background:#0000ff;
font-size:2px;visibility:visible"></div>')
write('<div style="position:relative;width:3px;height:3px;background:#FF0000;
font-size:3px;visibility:visible"></div>')
write('</div>')
}
}
var Clrs=new Array(6)
Clrs[0]='ff0000';
Clrs[1]='00ff00';
Clrs[2]='000aff';
Clrs[3]='ff00ff';
Clrs[4]='fff000';
Clrs[5]='fffff0';
if (document.layers)
{window.captureEvents(Event.MOUSEMOVE);}
var yBase = 200;
var xBase = 200;
var step;//osw
var currStep = 0;
var Xpos = 1;
var Ypos = 1;

if (document.all)
{
function MoveHandler(){
Xpos = document.body.scrollLeft+event.x;
Ypos = document.body.scrollTop+event.y;
}
document.onmousemove = MoveHandler;
}

else if (document.layers)
{
function xMoveHandler(evnt){
Xpos = evnt.pageX;
Ypos = evnt.pageY;
}
window.onMouseMove = xMoveHandler;
}

function animateLogo() {
if (document.all)
{
yBase = window.document.body.offsetHeight/8;
xBase = window.document.body.offsetWidth/8;
}
else if (document.layers)
{
yBase = window.innerHeight/8;
xBase = window.innerWidth/8;
}

if (document.all)
{
for ( i = 0 ; i < starsDiv.all.length ; i++ )
{step=3;
starsDiv.all[i].style.top = Ypos + yBase*Math.cos((currStep + i*4)/12)*Math.cos(0.7+currStep/200);
starsDiv.all[i].style.left = Xpos + xBase*Math.sin((currStep + i*3)/10)*Math.sin(8.2+currStep/400);
for (ai=0; ai < Clrs.length; ai++)
{
var c=Math.round(Math.random()*[ai]);
}
starsDiv.all[i].style.background=Clrs[c];
}
}

else if (document.layers)
{
for ( j = 0 ; j < 14 ; j++ )
{step = 3;
var templayer="a"+j
document.layers[templayer].top = Ypos + yBase*Math.sin((currStep + j*4)/12)*Math.cos(0.7+currStep/200);
document.layers[templayer].left = Xpos + xBase*Math.sin((currStep + j*3)/10)*Math.sin(8.2+currStep/400);
for (aj=0; aj < Clrs.length; aj++)
{
var c=Math.round(Math.random()*[aj]);
}
document.layers[templayer].bgColor=Clrs[c];
}
}
currStep+= step;
setTimeout("animateLogo()", 10);
}
animateLogo();
</script>
--------------------------------------------------------------------------------------------------------------

Фонтан звёздочек при клике.

Код:
--------------------------------------------------------------------------------------------------------------
<SCRIPT language=JavaScript1.2>
StarMouse(0)
var ver = navigator.appVersion;
var dom = document.getElementById ? 1 : 0;
var ie5 = (ver.indexOf("MSIE 5") > -1 && dom) ? 1 : 0;
var n = (document.layers);
var ie = (document.all);

var sparksAflyin = 0;
var totalSparks = 0;
var sparksOn = 1;
function StarMouse() {
document.onmousedown = mouseDown;
if (n) document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE);
}
function mouseDown(e) {
if (sparksOn) {
var mousex = (n) ? e.pageX : event.x+document.body.scrollLeft;
var mousey = (n) ? e.pageY : event.y+document.body.scrollTop;
if (!sparksAflyin) {
for (var k = 0; k <= 6; k++)
eval('SHOW("sDiv'+k+'")');
sparksAflyin = 1;
totalSparks = 0;//osw
for(i = 0;i <= 6; i++)
eval('moveTo('+i+',0,'+mousex+','+mousey+')');
}
}
}
function moveTo(i,j, mousex, mousey){
if (j < eval('anim_'+i+'_x.length') ){
var tempx = eval('anim_'+i+'_x[j]+mousex');
var tempy = eval('anim_'+i+'_y[j]+mousey');
if (ie) {
if(tempy+30 > (document.body.offsetHeight+document.body.scrollTop))
tempy = document.body.offsetHeight+document.body.scrollTop-30;
if(tempx+30 > (document.body.offsetWidth+document.body.scrollLeft))
tempx = document.body.offsetWidth+document.body.scrollLeft-30;
eval('document.all.sDiv'+i+'.style.left = tempx;');
eval('document.all.sDiv'+i+'.style.top = tempy;');//fantasyflash.ru
}
if (n) {
eval('document.layers.sDiv'+i+'.left = tempx;');
eval('document.layers.sDiv'+i+'.top = tempy;');
}
j++;
setTimeout("moveTo("+i+","+j+","+mousex+","+mousey+")",50)
}
else {
eval('HIDE("sDiv'+i+'")');
totalSparks++;
}
if (totalSparks == 7) {
sparksAflyin = 0;
totalSparks = 0;
}
}
function SHOW(divName){
if (document.all)
eval('document.all.'+divName+'.style.visibility = "visible";');
else if (document.layers)
eval('document.layers["'+divName+'"].visibility = "visible";');//osw
}
function HIDE(divName){
if (document.all)
eval('document.all.'+divName+'.style.visibility = "hidden";');
else if (document.layers)
eval('document.layers["'+divName+'"].visibility = "hide";');
}
anim_0_x=new Array(20,20,10,0,0,0,0,0,0,0,0,0);
anim_0_y=new Array(-20,-40,-60,-80,-60,-40,-20,0,20,40,60,80);
anim_1_x=new Array(20,20,17,36,60,78,90,92,93,98,108,120,133,152,181);
anim_1_y=new Array(-20,-20,-33,-38,-38,-27,-2,25,51,84,113,141,162,212,253);
anim_2_x=new Array(20,20,2,3,4,5,6,7,8,9,10,12,13,15,18);
anim_2_y=new Array(-20,-20,-33,-38,-38,-27,-2,25,51,84,113,141,162,212,253);
anim_3_x=new Array(-20,-20,-2,-1,7,10,18,35,60,102,94,94,93,97,108,111,117,127);
anim_3_y=new Array(-20,-25,-64,-89,-104,-150,-173,-197,-213,-199,-151,-101,-66,-17,27,87,140,189);
anim_4_x=new Array(-20,-20,-10,-39,-30,-69,-64,-138,-154,-200,-181,-209,-191,-207,-203,-213,-202,-221,-211);
anim_4_y=new Array(-20,-20,-28,-51,-79,-100,-135,-154,-193,-183,-149,-134,-89,-60,8,51,107,157,201);
anim_5_x=new Array(-20,-29,-51,-72,-105,-133,-164,-189,-209,-229,-247,-270,-279,-282,-283,-283,-285,-286,-288);
anim_5_y=new Array(-20,-55,-86,-116,-154,-183,-205,-217,-217,-198,-169,-120,-44,-8,40,87,144,190,248);
anim_6_x=new Array(-20,-20,-7,14,44,79,143,186,217,226,234,244,250,259,265,274);
anim_6_y=new Array(-20,-21,-72,-113,-139,-166,-188,-181,-126,-68,-3,54,134,187,215,257);
// End -->
</SCRIPT>
--------------------------------------------------------------------------------------------------------------

Взлетающие звёздочки (картинки)от курсора.

Звёздочку можно заменить на другую картинку.
Код:
--------------------------------------------------------------------------------------------------------------
<SCRIPT language=JavaScript>
<!--
Image0 = new Image();
Image0.src = "http://svweb.narod.ru/image/zv22.gif";
Amount = 10;
Ymouse = -30;
Xmouse = -30;
Ypos = new Array();
Xpos = new Array();
Speed = new Array();
rate = new Array();
grow = new Array();
Step = new Array();
Cstep = new Array();
nsSize = new Array();
ns = (document.layers)?1:0;
(document.layers)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt) {
Ymouse=(document.layers)?evnt.pageY-20:event.y-20;
Xmouse=(document.layers)?evnt.pageX:event.x;
}
(document.layers)?window.onMouseMove=Mouse:document.onmousemove=
Mouse;
for (i = 0; i < Amount; i++) {
Ypos[i] = Ymouse;
Xpos[i] = Xmouse;
Speed[i] = Math.random()*6+2;
Cstep[i] = 0;
Step[i] = Math.random()*0.1+0.05;
grow[i] = 5;
nsSize[i] = Math.random()*15+5;
rate[i] = Math.random()*0.5+0.1;
}
if (ns) {
for (i = 0; i < Amount; i++) {
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+Image0.src+" name='N' width="+nsSize[i]+" height="+nsSize[i]+"></LAYER>");
}
}
else {
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++) {
document.write('<img id="si" src="'+Image0.src+'" style="position:absolute;top:0px;left:0px;filter:alpha(opacity=80)">');
}
document.write('</div></div>');
}
function Fly() {
var hscrll = (document.layers)?window.pageYOffset:document.body.scrollTop;
var wscrll = (document.layers)?window.pageXOffset:document.body.scrollLeft;
for (i = 0; i < Amount; i++){
sy = Speed[i] * Math.sin(270 * Math.PI / 180);
sx = Speed[i] * Math.cos(Cstep[i] * 4);
Ypos[i] += sy;
Xpos[i] += sx;
if (Ypos[i] < -40) {
Ypos[i] = Ymouse;
Xpos[i] = Xmouse;
Speed[i] = Math.random() * 5 + 3;
grow[i] = 5;//osw
nsSize[i] = Math.random() * 15 + 5;
}
if (ns) {
document.layers['sn'+i].left = Xpos[i] + wscrll;
document.layers['sn'+i].top = Ypos[i] + hscrll;
}
else {
si[i].style.pixelLeft = Xpos[i] + wscrll;
si[i].style.pixelTop = Ypos[i] + hscrll;
si[i].style.width = grow[i];
si[i].style.height = grow[i];
}
grow[i] += rate[i];
Cstep[i] += Step[i];
if (grow[i] > 25) grow[i] = 25;
}
setTimeout('Fly()', 10);
}
Fly();
-->
</SCRIPT>
--------------------------------------------------------------------------------------------------------------

Текст вокруг курсора.

Код:
--------------------------------------------------------------------------------------------------------------
<SCRIPT language=JavaScript>
if (document.all) {
yourLogo = " Ваш текст";
logoFont = "Monotype Corsiva";
logoColor = "#FFFF00" ;
yourLogo = yourLogo.split('');
L = yourLogo.length;
TrigSplit = 300 / L;
Sz = new Array()
logoWidth = 100;
logoHeight = -60;
ypos = 0;
xpos = 0;
step = 0.03;
currStep = 10;
document.write('<div id="outer" style="position:absolute;top:0px;left:
0px"><div style="position:relative">');
for (i = 0; i < L; i++) {
document.write('<div id="ie" style="position:absolute;top:0px;left:0px;'
+'width:10px;height:10px;font-family:'+logoFont+';font-size:12px;'
+'color:'+logoColor+';text-align:center">'+yourLogo[i]+'</div>');<!--svweb.narod.ru-->
}
document.write('</div></div>');
function Mouse() {
ypos = event.y;
xpos = event.x - 5;
}
document.onmousemove=Mouse;
function animateLogo() {
outer.style.pixelTop = document.body.scrollTop;
for (i = 0; i < L; i++) {
ie[i].style.top = ypos + logoHeight * Math.sin(currStep + i * TrigSplit * Math.PI / 180);
ie[i].style.left = xpos + logoWidth * Math.cos(currStep + i * TrigSplit * Math.PI / 180);
Sz[i] = ie[i].style.pixelTop - ypos;
if (Sz[i] < 5) Sz[i] = 5;
ie[i].style.fontSize = Sz[i] / 1.7;
}
currStep -= step;
setTimeout('animateLogo()', 20);
}
window.onload = animateLogo;
}
</SCRIPT>
--------------------------------------------------------------------------------------------------------------

Курсор с "хвостиком"

Kод:
--------------------------------------------------------------------------------------------------------------
<style>
.spanstyle {
position:absolute;
visibility:visible;
top:-50px;
font-size:10pt;
font-family:Courier New;
font-weight:bold;
color:#FFFF00;
}
</style>

<body onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll" >

<script>
var x,y
var step=20
var flag=0

var message="Ваш текст Ваш текст " // Текст около мышки (обязательно после последней буквы пробел)
message=message.split("")

var xpos=new Array()
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50
}

var ypos=new Array()
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50
} function handlerMM(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
flag=1 } function makesnake() { if (flag==1 && document.all) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1] } xpos[0]=x+step ypos[0]=y for (i=0; i<message.length-1; i++) {
var thisspan = eval("span"+(i)+".style")
thisspan.posLeft=xpos[i]
thisspan.posTop=ypos[i] } } else if (flag==1 && document.layers) { for (i=message.length-1; i>=1; i--) { xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
var thisspan = eval("document.span"+i)
thisspan.left=xpos[i]
thisspan.top=ypos[i]
} } var timer=setTimeout("makesnake()",30)
}
</script>
<script>
<!-- Beginning of JavaScript -

for (i=0;i<=message.length-1;i++) {
document.write("<span id='span"+i+"' class='spanstyle'>")
document.write(message[i])
document.write("</span>") } if (document.layers){ document.captureEvents(Event.MOUSEMOVE); } document.onmousemove = handlerMM; // - End of JavaScript - --> </script> </html>
--------------------------------------------------------------------------------------------------------------

...←Назад↔ Далее→ ...