| 앞에 적은것은 그림을 하나만 지정하지만... 이것은 여러개를 떨어지게 할수가 있습니다. <head></head> 사이에 먼저 넣습니다. <SCRIPT LANGUAGE="javascript"> <!-- function timer() { var y y = chara1.style.posTop + 5 if(y > document.body.clientHeight*2) y = 0 chara1.style.posLeft = 100 + Math.sin(y/240) * 75 chara1.style.posTop = y y = chara2.style.posTop + 7 if(y > document.body.clientHeight*2) y = 0 chara2.style.posLeft = 160 + Math.sin(y/120) * 75 chara2.style.posTop = y y = chara3.style.posTop + 8 if(y > document.body.clientHeight*2) y = 0 chara3.style.posLeft = 80 + Math.sin(y/350) * 100 chara3.style.posTop = y y = chara4.style.posTop + 9 if(y > document.body.clientHeight*2) y = 0 chara4.style.posLeft = 230 + Math.sin(y/90) * 120 chara4.style.posTop = y y = chara5.style.posTop + 7 if(y > document.body.clientHeight*2) y = 0 chara5.style.posLeft = 300 + Math.sin(y/180) * 220 chara5.style.posTop = y y = chara6.style.posTop + 10 if(y > document.body.clientHeight*2) y = 0 chara6.style.posLeft = 360 + Math.sin(y/350) * 180 chara6.style.posTop = y y = chara7.style.posTop + 7 if(y > document.body.clientHeight*2) y = 0 chara7.style.posLeft = 500 + Math.sin(y/200) * 220 chara7.style.posTop = y y = chara8.style.posTop + 8 if(y > document.body.clientHeight*3) y = 0 chara8.style.posLeft = 570 + Math.sin(y/100) * 180 chara8.style.posTop = y setTimeout("timer()", 50) } //--> </SCRIPT> 넣었나요? 그럼 body태그안에 <body onload="setTimeout('timer()', 50)"> 이렇게 넣어줍니다. 로딩을 시킨다는 거죠... 그런다음... <body> 와 </body> 사이에... <IMG src="http://oxtag.com/html/img/drip_pink.gif" align="bottom" width="20" height="17" border="0" id="chara1" style="position:absolute;left:100;top:50;" name="chara1"> <IMG src="http://oxtag.com/html/img/drip_yellow.gif" align="bottom" border="0" id="chara2" style="position:absolute;left:200;top:150;" name="chara2"> <IMG src="http://oxtag.com/html/img/drip_blue.gif" align="bottom" border="0" id="chara3" style="position:absolute;left:300;top:100;" name="chara3"> <IMG src="http://oxtag.com/html/img/drip_pink.gif" align="bottom" width="20" height="17" border="0" id="chara4" style="position:absolute;left:400;top:250;" name="chara4"> <IMG src="http://oxtag.com/html/img/drip_yellow.gif" align="bottom" width="20" height="17" border="0" id="chara5" style="position:absolute;left:500;top:200;" name="chara5"> <IMG src="http://oxtag.com/html/img/drip_blue.gif" align="bottom" border="0" id="chara6" style="position:absolute;left:600;top:350;" name="chara6"> <IMG src="http://oxtag.com/html/img/drip_pink.gif" align="bottom" border="0" id="chara7" style="position:absolute;left:700;top:300;" name="chara7"> <IMG src="http://oxtag.com/html/img/drip_blue.gif" align="bottom" width="20" height="17" border="0" id="chara8" style="position:absolute;left:800;top:400;" name="ch ara8"> 이렇게 집어넣으면 됩니다. http://oxtag.com/html/img/drip_pink.gif 라고 적힌 부분있죠? 거기다가 가각 다른 이미지를 넣어주시면... 끝입니다. 태그연습장에서 연습해 보세요. |
반응형
'인터넷정보' 카테고리의 다른 글
| 브라우저 돌리기 (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 |
| 그림이 아래로 떨어지게 하는 효과1 (0) | 2007.10.17 |
| 그림이 아래로 떨어지게 하는 효과1 (0) | 2007.10.17 |
| 이미지 랜덤 모드 (0) | 2007.10.17 |
| 이미지 랜덤 모드 (0) | 2007.10.17 |