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]
훌륭하십니다...^^
oh~ ^0^b
툴팁기능이 이렇게 심플할수가 ㅎㅎㅎ
감격입니다. 원츄이고요 -_-)b
학교사이트를 만드는데, 위에서 풍선도움말로 미리보기를
넣으라는 압박에 자바스크립트로 골머리를 않고 있었는데
이렇게 간결한 방법이 있었다니..
정말로 고맙습니다 ^_^
늘 좋은 스크립트 들을 공개해 주셔서 감사합니다.
잘 쓰겠습니다.
정말 좋은 자료 감사히 쓰겠습니다.
근데 글자를 그대로 넣으면 글자가 한글자씩 밑으로 떨어지네요~^^*
js파일에서 popup.show(x, y, w+20, h, document.body);
이렇게 w옆에 20붙여주니까 한라이이면 하라인그래도 다 나오네요~^^*
감사합니다.
여러개의 버튼에 소스를 적용시킬때 제목을 다 따로 붙일수는 없나요?
셀렉트박스가 레이어 위로 나오는군요~
ie 5.0
셀렉트// IE 5.5 이상에서만 그렇게 됩니다. IE 5.5부터 생긴 Popup 객체를 사용했거든요. 다른 브라우저에서는 레이어가 셀렉트박스에 의해 안가려지는데... IE는 이래저래 성가신 점이 많은 브라우저네요.
linux9.0 에서 자바가 돌아 가야 사용가능한거 맞는지요...
--->php 에서 처리 못하는 건가요......
초보자// 정말 초보시군요. 음... 어디서 부터 설명을 드려야할지... 사실 질문의 의도도 정확히 파악이 안되는군요. -_-a