[Javascript] 마우스 물결표시

728x90
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<HTML>
<HEAD>
<STYLE>
.sp{position:absolute;top:-50;}
</STYLE>
<SCRIPT LANGUAGE="JavaScript"> 
<!--
 
//마우스를 따라 다닐 이미지들을 미리 읽어 둡니다.
trailimg = new Array()
for(i=0;i<6;i++){
trailimg[i] = new Image()
trailimg[i].src = "star"+i+".gif";
}
 
var x,y;
var xstep=5;  
var ystep=5;  
var flag=0;  
 
//이미지의 초기 x 좌표를 각각 -50으로 지정
var xpos=new Array();
for (i=0;i<=trailimg.length-1;i++) {
xpos[i]=-50;
}
 
//이미지의 초기 y 좌표를 각각 -50으로 지정
var ypos=new Array()
for (i=0;i<=trailimg.length-1;i++) {
ypos[i]=-50;
}
 
 
function moveok(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX;
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY;
flag=1;
}
 
function trail(){
if(flag !=1){
    if(document.all){
      for (i=0; i<=trailimg.length-1; i++) {
      document.all["myimg"+i].style.visibility="hidden";
      }
    }
    else if (document.layers) {
      for (i=0; i<=trailimg.length-1; i++) {
      document.layers["myimg"+i].visibility="hidden";
      }
    }
  } 
 
else if(flag==1){
  for (i=trailimg.length-1; i>=1; i--) {
  xpos[i]=xpos[i-1]+xstep;
  ypos[i]=ypos[i-1]+ystep;
  }
  xpos[0]=x+xstep;
  ypos[0]=y+ystep;
 
  if(document.all){
    for (i=0; i<=trailimg.length-1; i++) {
    document.all["myimg"+i].style.left=xpos[i];
    document.all["myimg"+i].style.top=ypos[i];
    document.all["myimg"+i].style.visibility="visible";
    }
  }
 
  else if (document.layers) {
    for (i=0; i<=trailimg.length-1; i++) {
    document.layers["myimg"+i].left=xpos[i];
    document.layers["myimg"+i].top=ypos[i];
    document.layers["myimg"+i].visibility="visible";
    }
  }
}
 
flag=0; 
setTimeout("trail()",30);
}
 
if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = moveok;
//-->
</SCRIPT>
</HEAD>
 
<BODY BGCOLOR="black" onload="trail();" style="overflow-x:hidden;">
<SCRIPT language="JavaScript">
<!--
for (i=0;i<=trailimg.length-1;i++) {
document.write("<SPAN ID=myimg"+i+" CLASS=sp>");
document.write("<IMG SRC=star"+i+".gif WIDTH=10 HEIGHT=10>");
document.write("</SPAN>");
}
// -->
</SCRIPT>
<FONT SIZE="5" COLOR="white">이미지가 물결치며 마우스를 따라 다닙니다.</FONT>
</BODY>
</HTML>
 
 
Colored by Color Scripter
cs
이미지가 물결치며 마우스를 따라 다닙니다.
728x90
저작자표시 비영리
순수한소년

[Javascript] 마우스 물결표시

티스토리툴바

[Javascript] 마우스 물결표시

관련글

티스토리툴바
