http://oxtag.com/html/ex/mouselayer.html
<html>
<head><title>♡ 카멜롯™의 소스천국 태그피아 ♡</title>
<!-- 여기서부터 헤드에 넣어주세요 -->
<style TYPE="text/css">
<!--
#a1 {position:absolute; left:260; top:175; width:50; height:50; visibility:hidden;}
#a2 {position:absolute; left:288; top:175; width:50; height:50; visibility:hidden;}
#a3 {position:absolute; left:260; top:175; width:50; height:50; visibility:hidden;}
#a4 {position:absolute; left:288; top:175; width:50; height:50; visibility:hidden;}
#a5 {position:absolute; left:260; top:175; width:50; height:50; visibility:hidden;}
#a6 {position:absolute; left:288; top:175; width:50; height:50; visibility:hidden;}
// -->
</style>
<!-- 여기까지 헤드 부분입니다. -->
</head>
<body>
<!-- 아래는 바디에 넣어주십시오. -->
<script LANGUAGE="JavaScript">
<!--
function preloader() {
if (document.images) {
preloads = new Array(25);
for (m=0; m<=24; m++) {
preloads[m] = new Image(); }
}}
netscape = (document.layers) ? 1:0
goodIE = (document.all) ? 1:0
var delay = 15;
var yAmpl = 3;
var yMax = 8;
var step = .3;
var ystep = .3;
var currStep = 0;
var tAmpl=1;
var j = 0;
var Xpos = 300;
var Ypos = 360;
document.onmousemove=MoveHandler;
if (netscape) {
window.captureEvents(Event.MOUSEMOVE);
// Logo animation
var yBase = window.innerHeight/2;
var xBase = window.innerWidth/2;
function MoveHandler(e) {
if (netscape || goodIE) {
Xpos = (netscape)?e.pageX:event.x
Ypos = (netscape)?e.pageY:event.y
}}
window.onMouseMove = MoveHandler;
}
function startup() {
if (netscape) {
Xpos = 50;
Ypos = 50;
document.a1.visibility='visible';
document.a2.visibility='visible';
document.a3.visibility='visible';
document.a4.visibility='visible';
document.a5.visibility='visible';
document.a6.visibility='visible';
}
else if (goodIE) {
document.all.a1.style.visibility='visible';
document.all.a2.style.visibility='visible';
document.all.a3.style.visibility='visible';
document.all.a4.style.visibility='visible';
document.all.a5.style.visibility='visible';
document.all.a6.style.visibility='visible';
var windowWidth=document.body.clientWidth;
var windowHeight=document.body.clientHeight;
Xpos = (windowWidth/2);
Ypos = (windowHeight/2);}}
function littlejewels() {
if (netscape) {
yBase = window.innerHeight/4 ;
xBase = window.innerWidth/4;
for ( j = 0 ; j < 6 ; j++ ) {
document.layers[j].top=Ypos+Math.cos((20*Math.sin(currStep/(85+j)))+j*70)*yBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep+j*55)/10);
document.layers[j].left=Xpos+Math.sin((20*Math.sin(currStep/85))+j*70)*xBase*(Math.sin(10+currStep/(10+j))+0.2)*Math.cos((currStep+j*55)/10);
}
currStep += step;
setTimeout("littlejewels()", 10) ;
}
else if (goodIE) {
var yBase =document.body.clientWidth/4;
var xBase =document.body.clientHeight/4;
for ( j = 1 ; j <= 6 ; j++ ) {
eval("document.all.a"+j+".style.top=Ypos+Math.cos((20*Math.sin(currStep/(85+j)))+j*70)*yBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep+j*55)/10)");
eval("document.all.a"+j+".style.left=Xpos+Math.sin((20*Math.sin(currStep/85))+j*70)*xBase*(Math.sin(10+currStep/(10+j))+0.2)*Math.cos((currStep+j*55)/10)");
}
currStep += step;
setTimeout("littlejewels()", 10) ;
}
}
// -->
</script>
<div ID="a1">
<dl>
<dd><img src="../img/flw.gif" width="28" height="26" border="0"> </dd>
</div><div ID="a2">
<dd><img src="../img/flw.gif" width="20" height="17" border="0"></dd>
</div><div ID="a3">
<dd><img src="../img/flw.gif" width="20" height="17" border="0"></dd>
</div><div ID="a4">
<dd><img src="../img/flw.gif" width="20" height="17" border="0"></dd>
</div>
<div ID="a5" align="center">
<dd> </dd>
</div>
<div align="center">
<dd>
</div>
<div ID="a6">
</dlv>
</div><script language="JavaScript">
<!--
startup(); littlejewels();
//-->
</script>
<!-- 여기까지 바디 부분입니다. 위의 이미지를 바꾸실려면 주소만 바꾸시는건 아시겠죠. -->
<p align=center>소스는 head와 body부분을 구분하셔서 넣으시고요.<br> 이미지는 적당한 걸 찾아서 쓰시기 바랍니다.<br> 위 소스 그대로 복사해서 쓰셔도 됩니다.
</p>
</body>
</html>
'인터넷정보' 카테고리의 다른 글
| 공지창이 왼쪽에서 오른쪽으로 휘~~~리~~~릭~~~ (0) | 2007.10.17 |
|---|---|
| 공지창이 왼쪽에서 오른쪽으로 휘~~~리~~~릭~~~ (0) | 2007.10.17 |
| 마우스 따라다니는 이미지 (0) | 2007.10.17 |
| 마우스 따라다니는 이미지 (0) | 2007.10.17 |
| 마우스 따라 다니는 이미지 (0) | 2007.10.17 |
| 마우스 오버시 이미지 서서히 변하게 하는 소스 2 (0) | 2007.10.17 |
| 마우스 오버시 이미지 서서히 변하게 하는 소스 2 (0) | 2007.10.17 |
| 링크된 곳에 마우스 오버시 칼러 생기게하기 (0) | 2007.10.17 |
| 링크된 곳에 마우스 오버시 칼러 생기게하기 (0) | 2007.10.17 |
| 글씨가 돌면서 마우스 따라다님 (0) | 2007.10.17 |