웹마스터 팁

출처  http://www.dynamicdrive.com/dynamicindex5/rainbow.htm

기존의 링크의 점선테두리 없애는 방법과 중복으로 써도 되는군요.;;
처음에 적용했을땐 뭔가 안되더니 푸터파일에 둘다 써서 적용하니 이상없네요

제가 사용하는 점선테두리 없애는 건 아래의 링크의 방법입니다.

http://www.nzeo.com/bbs/zboard.php?id=p_javascript&no=198

-수정끝-

링크텍스트뿐만 아니라 그냥 텍스트에도 적용할수있는 방법도 뽑아왔습니다.


Note: You can explicitly add the rainbow effect to other text (not link text), by inserting the code onmouseover="doRainbow(this);" and onmouseout="stopRainbow();" inside the tag in question.

이아래의 소스를 몽땅 복사해다 붙여서 사용하면 되는데 js파일로 따로 만들어서 사용하실분이라면 위의 출처에 만들어진게 있습니다.
그걸 받아다가 사용하셔도 됩니다.
그리고  IE 6.0이상에서만 가능한건지도 모르겠습니다.;;;;

<SCRIPT LANGUAGE="JavaScript">
<!--
/************************************************************************/
/* Rainbow Links Version 1.03 (2003.9.20)                               */
/* Script updated by Dynamicdrive.com for IE6                           */
/* Copyright (C) 1999-2001 TAKANASHI Mizuki                             */
/* takanasi@hamal.freemail.ne.jp                                        */
/*----------------------------------------------------------------------*/
/* Read it somehow even if my English text is a little wrong! ;-)       */
/*                                                                      */
/* Usage:                                                               */
/*  Insert '<script src="rainbow.js"></script>' into the BODY section,  */
/*  right after the BODY tag itself, before anything else.              */
/*  You don't need to add "onMouseover" and "onMouseout" attributes!!   */
/*                                                                      */
/*  If you'd like to add effect to other texts(not link texts), then    */
/*  add 'onmouseover="doRainbow(this);"' and                            */
/*  'onmouseout="stopRainbow();"' to the target tags.                   */
/*                                                                      */
/* This Script works with IE4,Netscape6,Mozilla browser and above only, */
/* but no error occurs on other browsers.                               */
/************************************************************************/


////////////////////////////////////////////////////////////////////
// Setting

var rate = 20;  // Increase amount(The degree of the transmutation)


////////////////////////////////////////////////////////////////////
// Main routine

if (document.getElementById)
window.onerror=new Function("return true")

var objActive;  // The object which event occured in
var act = 0;    // Flag during the action
var elmH = 0;   // Hue
var elmS = 128; // Saturation
var elmV = 255; // Value
var clrOrg;     // A color before the change
var TimerID;    // Timer ID


if (document.all) {
    document.onmouseover = doRainbowAnchor;
    document.onmouseout = stopRainbowAnchor;
}
else if (document.getElementById) {
    document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
    document.onmouseover = Mozilla_doRainbowAnchor;
    document.onmouseout = Mozilla_stopRainbowAnchor;
}


//=============================================================================
// doRainbow
//  This function begins to change a color.
//=============================================================================
function doRainbow(obj)
{
    if (act == 0) {
        act = 1;
        if (obj)
            objActive = obj;
        else
            objActive = event.srcElement;
        clrOrg = objActive.style.color;
        TimerID = setInterval("ChangeColor()",100);
    }
}


//=============================================================================
// stopRainbow
//  This function stops to change a color.
//=============================================================================
function stopRainbow()
{
    if (act) {
        objActive.style.color = clrOrg;
        clearInterval(TimerID);
        act = 0;
    }
}


//=============================================================================
// doRainbowAnchor
//  This function begins to change a color. (of a anchor, automatically)
//=============================================================================
function doRainbowAnchor()
{
    if (act == 0) {
        var obj = event.srcElement;
        while (obj.tagName != 'A' && obj.tagName != 'BODY') {
            obj = obj.parentElement;
            if (obj.tagName == 'A' || obj.tagName == 'BODY')
                break;
        }

        if (obj.tagName == 'A' && obj.href != '') {
            objActive = obj;
            act = 1;
            clrOrg = objActive.style.color;
            TimerID = setInterval("ChangeColor()",100);
        }
    }
}


//=============================================================================
// stopRainbowAnchor
//  This function stops to change a color. (of a anchor, automatically)
//=============================================================================
function stopRainbowAnchor()
{
    if (act) {
        if (objActive.tagName == 'A') {
            objActive.style.color = clrOrg;
            clearInterval(TimerID);
            act = 0;
        }
    }
}


//=============================================================================
// Mozilla_doRainbowAnchor(for Netscape6 and Mozilla browser)
//  This function begins to change a color. (of a anchor, automatically)
//=============================================================================
function Mozilla_doRainbowAnchor(e)
{
    if (act == 0) {
        obj = e.target;
        while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
            obj = obj.parentNode;
            if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
                break;
        }

        if (obj.nodeName == 'A' && obj.href != '') {
            objActive = obj;
            act = 1;
            clrOrg = obj.style.color;
            TimerID = setInterval("ChangeColor()",100);
        }
    }
}


//=============================================================================
// Mozilla_stopRainbowAnchor(for Netscape6 and Mozilla browser)
//  This function stops to change a color. (of a anchor, automatically)
//=============================================================================
function Mozilla_stopRainbowAnchor(e)
{
    if (act) {
        if (objActive.nodeName == 'A') {
            objActive.style.color = clrOrg;
            clearInterval(TimerID);
            act = 0;
        }
    }
}


//=============================================================================
// Change Color
//  This function changes a color actually.
//=============================================================================
function ChangeColor()
{
    objActive.style.color = makeColor();
}


//=============================================================================
// makeColor
//  This function makes rainbow colors.
//=============================================================================
function makeColor()
{
    // Don't you think Color Gamut to look like Rainbow?

    // HSVtoRGB
    if (elmS == 0) {
        elmR = elmV;    elmG = elmV;    elmB = elmV;
    }
    else {
        t1 = elmV;
        t2 = (255 - elmS) * elmV / 255;
        t3 = elmH % 60;
        t3 = (t1 - t2) * t3 / 60;

        if (elmH < 60) {
            elmR = t1;  elmB = t2;  elmG = t2 + t3;
        }
        else if (elmH < 120) {
            elmG = t1;  elmB = t2;  elmR = t1 - t3;
        }
        else if (elmH < 180) {
            elmG = t1;  elmR = t2;  elmB = t2 + t3;
        }
        else if (elmH < 240) {
            elmB = t1;  elmR = t2;  elmG = t1 - t3;
        }
        else if (elmH < 300) {
            elmB = t1;  elmG = t2;  elmR = t2 + t3;
        }
        else if (elmH < 360) {
            elmR = t1;  elmG = t2;  elmB = t1 - t3;
        }
        else {
            elmR = 0;   elmG = 0;   elmB = 0;
        }
    }

    elmR = Math.floor(elmR).toString(16);
    elmG = Math.floor(elmG).toString(16);
    elmB = Math.floor(elmB).toString(16);
    if (elmR.length == 1)    elmR = "0" + elmR;
    if (elmG.length == 1)    elmG = "0" + elmG;
    if (elmB.length == 1)    elmB = "0" + elmB;

    elmH = elmH + rate;
    if (elmH >= 360)
        elmH = 0;

    return '#' + elmR + elmG + elmB;
}

//-->
</SCRIPT>

제목 글쓴이 날짜
[초간단 자바스크립트!] 플래시 FullSize로 보여주기 [4] ∑Ztxy 2004.02.05
Select 태그 관련 스크립트 [12] Zective 2004.02.04
주소창에 아이콘을 달자(다음,엠파스처럼) [3] piasol 2004.02.01
앞,뒤,새로고침 만들기 [2] piasol 2004.02.01
세이클럽 스크롤바 [7] file 세강 :D 2004.02.01
[초간단 자바스크립트!] 자바로 홈페이지를부드럽게!!(1) [4] ∑Ztxy 2004.01.27
인풋(코멘트)창 크기 조정 정재원 2004.01.27
[초간단 자바스크립트!] 자바로 로그인폼 만들기 [3] ∑Ztxy 2004.01.26
전체화면에서 스크롤바 없애기 [7] 이태식 2004.01.23
[초간단 자바스크립트!] 색깔바뀌는 메뉴 [3] ∑Ztxy 2004.01.19
[초간단 자바스크립트!] 이미지 갤러리 [2] ∑Ztxy 2004.01.18
[초간단 자바스크립트!] 튀어나오는 글자..-_-;; ∑Ztxy 2004.01.18
[초간단 자바스크립트(강의)!]나만의 익스플로러창 만들기[허접] [2] ∑Ztxy 2004.01.17
Thinking In Java 2nd Edition file n25 2004.01.14
[초간단 자바스크립트!] 홈페이지접속 시간,날짜 표시기 [3] ∑Ztxy 2004.01.09
아기창 자동으루 띄우고 엄마창 자동으루 죽이기 -_-;; [13] 후르츠 2004.01.09
마우스 올리면 링크 텍스트를 무지개빛으로_12시20분 수정.;; [1] keymove 2004.01.06
[초간단 자바스크립트!] 아이프레임 이용한 이미지 갤러리(?) ∑Ztxy 2004.01.02
화면 오른쪽 아래부분에 떠있는 메뉴 레이어(마우스 오버시 부메뉴 펼쳐짐) [7] 봉팀장 2003.12.30
링크에 마우스를 올리면 배경 변하게 하는 소스 봉팀장 2003.12.30