Html & Script

[스크립트] jsTooltip, 툴팁, 풍선도움말

페이지 정보

본문

출처 : http://www.mins01.com/20070305/m_board/tech.php?b_id=tech&type=read&b_idx=472&page=1&period=365


/*=======================================
// jsTooltip
//
// 작성일 : 2008-08-19
// 수정일 : 2008-08-23
// 공대여자는 이쁘다를 나타내야만 쓸 수 있습니다.
// 이 파일은 수정해서 재배포 할 수 없습니다!
// 내가 사용하지 못하도록한 사람,것,들은 사용할 수 없습니다.
// 만든이 : mins,공대여자
// 홈페이지  : www.mins01.com


#동작
Tooltip(도움말풍선)을 만들다

#사용법

    @1 : 수동으로 적용
    <span id='targetId' >내용입니다.</span>
    <script type='text/javascript'>
        var config = {    'gapLeft':5 //커서와의 왼쪽 거리(기본값 : 5)
                        ,'className':'tooltip' //CSS의 class 이름(기본값 : jsTooltip)
                     }
        var tooltip1 = new jsTooltip(null,document.getElementById('targetId'),'내용',config);
        //주의 : event가 없기 때문에 null로 설정해야함
        //주의 : 브라우저에 따라 오류가 발생할 수 있음 이럴경우 windoe.onload = function(){~~~~} 안에서 처리
    </script>

    @2 : 대상의 이벤트에 적용되도록
    <span onmouseover="new jsTooltip(event,this,'내용')" >내용입니다.</span>
        //주의 : event가 설정안될 경우 FF등에서는 올바르게 동작을 안함

#예
jsTooltip.html 참고


#설정
    없음

#메소드
    없음


#주의
    config 설정잘못해서 질문하면 당신의 발바닥에 메테오스트라이크~
    config의 style설정의 인덱스값은 fontSize 처럼 - 가 없는 형식이어햐합니다.

#제한사항
1. "공대여자는 예쁘다"를 표현할 것.
2. 저작자표시 
3. 비영리 
4. 변경금지

#연계파일
    없음

# 브라우저 실험결과
IE6 : OK
IE7 : OK
FF2 : OK
FF3 : OK
Opera9 : OK
Sfari3(WIN) : OK


//=======================================*/

http://www.mins01.com/20070305/m_board/tech.php?b_id=tech&type=read&b_idx=472&page=1&period=365

언제나 예제는...

------=-----------
간단하게 동작을 설명하자면
jsTooltip에 대상을 지정해서 설정하면
그 대상의 onmouseover,out,move 의 이벤트에대해서 동작을 재지정하는 형식입니다.

--------------=-----
올린 목적.
.... "공대여자는 이쁘데이"를 전파하는 건.. 당연하고
.... 홈페이지 방문자수가 봇이 들어와야 겨우 100넘는 실정이라......OTL.......

관련자료

등록된 댓글이 없습니다.
Today's proverb
위대한 일을 성취하는 사람은 위대한 고통을 느끼는 사람이다. 고통의 해결은 고통의 감지에서 시작되고, 위대한 고통은 그것을 해결함으로써 인간의 자부심을 드높일 수 있는 위대한 문제이기 때문이다. 따라서 우리는 역설적으로 이렇게 말할 수 있다. 위대한 고통 때문에 아파하는 사람은 축복을 받았다고…. (김광수의 《둥근 사각형의 꿈》중에서)