질문 부지런히 해주시니 오히려 고마운 생각이 남산 만큼...이네요.
이번 질문은 동호회 왼쪽 프레임의 메뉴를 분석하면서 설명드리겠습니다.
주요 부분 소스를 퍼오면...
<SCRIPT language="JavaScript">
{
t1off = new Image();
t1off.src = "image/off1.gif";
t1on = new Image();
t1on.src = "image/on1.gif";
}
function img_act(imgName)
{
imgOn = eval(imgName + "on.src");
document [imgName].src = imgOn;
}
function img_inact(imgName)
{
imgOff = eval(imgName + "off.src");
document [imgName].src = imgOff;
}
</SCRIPT>
<A href="info.html" target="right" color = "#FF0000">t1');" color = "#FF0000">t1')"><IMG src="image/off1.GIF" width="90" height="20" border="0" alt="공지사항" name="t1" target="_right"></A>
위와 같습니다. ( 붉은 색 글자는 사용자 마음대로 변경할 수 있습니다. 단, t1 은 t1끼리 같은 명칭으로 바꾸세요.)
이 자바스크립트에서는 마우스 on, off 상태에 따라 각각 다른 이미지가 출력되는 효과를 나타냅니다. 따라서 색깔이 바뀌는 것은 다른 색으로 꾸며진 두 개의 이미지가 바뀌기 때문인 것이죠.
사용시 알아두어야 할 것들을 설명해드리겠습니다.
t1on.src="image/on1.gif" : t1이라는 이름을 가진 ( t1은 위에서 imgName입니다. ) 이미지 묶음( 마우스 위치에 따라 바뀌는 한 쌍의 이미지들)에 마우스를 가져다 놓으면 http://사용자.홈페이지.url/image/on1.gif 라는 이미지가 보이게 됩니다.
( image 라는 폴더 안에 on1.gif 파일이 있는 겁니다. 이건 알죠? ^^ )
마우스가 올라갔는데 왜 이미지 이름을 on으로 정했냐구요? 이는 저희 터에서 눌러지는 버튼 형식을 사용했기 때문에 터지기가 임의로 지은 이름입니다. 여기서 on은 마우스가 이미지 위에 있을 때라는 의미지요.
t1off.src="image/off1.gif" : 마찬가지로 마우스가 이미지 범위 밖에 있을 때 나타날 이미지 상태입니다.
여러 가지 메뉴에 위의 효과를 모두 적용하고 싶다면 이와 같이 반복 하십시오.
t1off = new Image();
t1off.src = "image/off1.gif";
t1on = new Image();
t1on.src = "image/on1.gif";
t2off = new Image();
t2off.src = "image/off2.gif";
t2on = new Image();
t2on.src = "image/on2.gif";
:
:
:
:
와
<A href="info.html" target="right" color = "#FF0000">t1');" color = "#FF0000">t1')"><IMG src="image/off1.GIF" width="90" height="20" border="0" alt="공지사항" name="t1" target="_right"></A>
<A href="info.html" target="right" color = "#FF0000">t2');" color = "#FF0000">t2')"><IMG src="image/off1.GIF" width="90" height="20" border="0" alt="공지사항" name="t2" target="_right"></A>
:
:
:
:
이렇게 하시면 될 겁니다.
써보시고 안되면 또 물어보세요~ *^^*