1. 개요 (Overview)
객체에 사용자가 직접 디자인한 풍선도움말을 보여줄 수 있는 스크립트입니다.
2. 사용법 (Usage)
우선, 풍선도움말을 디자인해서 코드를 DIV 태그 안에 집어넣습니다. 꼭 display 속성을 none으로 해주셔야 합니다.
[code type=html]
<div id="balloonHint" style="display: none">
<table cellspacing="0" cellpadding="5" border="0" bgcolor="#ffffcc" style="border: 1px solid #cc3300">
<tr>
<td>대충 제목
</td>
</tr>
<tr>
<td>{{hint}}
</td>
</tr>
</table>
</div>
[/code]
그 다음에 풍선도움말을 활성화시킵니다. 아이디는 위에서 정한 아이디와 같기만 하면 뭐라도 상관없습니다.
[code type=html]
[/code]
이제 풍선도움말을 보여주고자 하는 태그에 hint 속성을 부여합니다.
[code type=html]http://mygony.com
이걸로 끝입니다. 저 스스로가 귀찮은 것은 딱 질색이라서 최대한 간단하게 사용하실 수 있도록 만들었습니다.
※ 주의! 풍선도움말 레이어의 글꼴 스타일 등의 형식은 반드시 레이어안에 직접 작성해주세요.
3. 사용예제
아래는 이 스크립트의 간단한 예제입니다.
[#NOBR_START#]
http://mygony.com
[#NOBR_END#]
아래는 매뉴얼과 소스를 모두 포함한 압축 파일입니다.
[download]http://mygony.com;/wp-content/uploads/2005/04/281578.zip;Click to download[/download]
balloonHint("balloonHint")
함수 사용한 언어가 java 언어로 작성된거 같아서요...
지가 잘못보앗나(javascript 언어로 작성한건가요...)
아주 옛날에 자바 언어를 잠깐 본적이 있어서요 그렇게 생각을
......
초보자// 아... javascript 예요. ^^
ballooHint("balloonHint"){****}---> 이함수를 어디에 위치 시켜야 하지요
소스 자체가 그냥 출력하면서 되질 않습니다
신입생// 디자인한 풍선도움말 태그 다음에 위치하면 됩니다.
아... 그 전에
<script language="javascript" src="gony.balloon.js"></script>
등으로 풍선도움말 스크립트를 포함시켜야 하구요.
잘 보고 있습니다. 종종 들릴께여.
실례합니다..
혹시 오버했을때 툴팁에 배경색이 디폴트로 흰색으로 되있네요..
혹시 투명이 되도록할순 없을까요?^^
황장군// 시간나면 한번 보도록 할게요. 급한 일들 좀 끝나고 나면요. ㅠ.ㅠ
감사합니다. 여지껏 본 풍선 도움말 중에서 가장 좋은 것도, 가장 간단한 것도 아니지만, 전체적으로 사이트를 쭈~욱 둘러보고나서 하는 말인데 설명을 아주 잘 하셨군요. 사용자들에게 하여금 이해가 편하게 글을 잘 쓰셨네요. 나중에 이 자료들 모아서 책 한권 내시길.. ㅎㅎ
정성이 보이는 사이트군요. 번창하세요. ^^ (헉, 웃는표정이 왜케커? verdana 글꼴이네~~ ㅋㅋ)
좋은 자료 감사히 씁니다
좋은 자료 감사히 쓰겠습니다.
(분석해봐야지 크크 🙂 잘볼께요~