본문 바로가기

javascript

자바스크립트와 스타일시트로 멋진 텍스트 메뉴를

<HTML>
<HEAD>

<BODY>

<!-- 1. 아래 스크립트를 BODY 부분에 복사 해 넣으세요 ----------->

<script language="JavaScript">
<!--

    {
    document.body.onmouseover=makeCool;
    document.body.onmouseout=makeNormal;
    }

    function makeCool() {
        src = event.toElement;
        if (src.tagName == "A") {
            src.oldcol = src.style.color;
            if (src.oldcol == "rgb(0,0,0)") {
                        src.style.color = "#0000FF";
                }
            else {                
                    if (src.oldcol == "rgb(255,255,0)") {
                            src.style.color = "#FF0000";
                    }
                    if (src.oldcol == "rgb(0,0,255)") {
                            src.style.color = "#000000";
                    }
                    if (src.oldcol == "rgb(255,0,0)") {
                            src.style.color = "#FFF000";
                    }
            }
        }
    }
    function makeNormal() {
        src=event.fromElement;
        if (src.tagName == "A") {
            src.style.color = src.oldcol;
        }
    }
// -->
</script>


<!------------- 메뉴 레이어 입니다 -------------->

<div align="left">
<table border="0" cellpadding="0" cellspacing="0" width="100%" height="44">
  <tr>
    <td bgcolor="#FF0000" align="center" width="25%" height="44"><b><a
    href="a.htm" target="_blank" style="color: rgb(0,0,0)">Linkcolor 1</a></b></td>
    <td bgcolor="#000000" align="center" width="25%" height="44"><b><a
    href="b.htm" target="_blank" style="color: rgb(255,255,0)">Linkcolor 2</a></b></td>
    <td bgcolor="#FFFF00" align="center" width="25%" height="44"><b><a
    href="c.htm" target="_blank" style="color: rgb(0,0,255)">Linkcolor 1</a></b></td>
    <td bgcolor="#0000FF" align="center" width="25%" height="44"><b><a
    href="d.htm" target="_blank" style="color: rgb(255,0,0)">Linkcolor 2</a></b></td>
  </tr>
</table>
</div>

<!------------- 메뉴 레이어 입니다 -------------->

</body>
</html>