API & download Url : http://vadikom.com/demos/poshytip/
test Url : http://www.uhoon.co.kr/test/459.html
툴팁에 대한 플러그인 입니다..
jQuery Core 1.4 버전 이후에서 사용하려면 아래와 같이 수정되어야 합니다. (글 작성일 기준 현재 1.9.1 이 최신인데 수정해야 작동합니다. 아래 첨부된 파일은 수정된 것입니다.)
* jquery.poshytip.js
ie6 = $.browser.msie && $.browser.version == 6; // 삭제
ie6 = !!window.createPopup && document.documentElement.currentStyle.minWidth == 'undefined'; // 추가
Options- contentString, DOM element, Function, jQuery
Possible Values: '[title]', 'string', element, function(updateCallback){...}, jQuery
Content to display.- classNameString
- Class for the tips.
- bgImageFrameSizeNumber
- Size in pixels for the background-image (if set in CSS) frame around the inner content of the tip.
- showTimeoutNumber
- Timeout before showing the tip (in milliseconds 1000 == 1 second).
- hideTimeoutNumber
- Timeout before hiding the tip.
- timeOnScreenNumber
- How long the tip will be displayed before automatically hiding.
- showOnString
Possible Values: 'hover', 'focus', 'none'
Handler for showing the tip. Use 'none'
if you would like to trigger the tooltip just manually (i.e. by calling the 'show'
and 'hide'
methods).- liveEventsBoolean
- Use live events.
Note that the API methods (except 'destroy') won't work reliably when live events are used. They will only work for the elements for which the tooltip has been initialized (i.e. shown at least once). Live events are supported in jQuery 1.4.2+. - alignToString
Possible Values: 'cursor', 'target'
Align/position the tip relative to- alignXString
Possible Values: 'right', 'center', 'left', 'inner-left', 'inner-right'
Horizontal alignment for the tip relative to the mouse cursor or the target element - values 'inner-*' matter if alignTo:'target'
- alignYString
Possible Values: 'bottom', 'center', 'top', 'inner-bottom', 'inner-top'
Vertical alignment for the tip relative to the mouse cursor or the target element - values 'inner-*' matter if alignTo:'target'
- offsetXNumber
- Offset X pixels from the default position - doesn't matter if
alignX:'center'
- offsetYNumber
- Offset Y pixels from the default position - doesn't matter if
alignY:'center'
- allowTipHoverBoolean
- Allow hovering the tip without hiding it onmouseout of the target - matters only if
showOn:'hover'
- followCursorBoolean
- If the tip should follow the cursor - matters only if
showOn:'hover'
andalignTo:'cursor'
- fadeBoolean
- Use fade animation.
- slideBoolean
- Use slide animation.
- slideOffsetNumber
- Slide animation offset.
- showAniDurationNumber
- Show animation duration.
- hideAniDurationNumber
- Hide animation duration.
Methods- .poshytip('show')
- Manually show the tooltip. Make sure the
alignTo
option is set to 'target'
in order the tooltip to be properly positioned when you trigger it. - .poshytip('hide')
- Manually hide the tooltip.
- .poshytip('update', content, [ dontOverwriteOption ] )
- Update the tooltip content at any time.
content '[title]', 'string', element, function(updateCallback){...}, jQuery
dontOverwriteOption (optional) A boolean flag - if set to true
the content will be updated just temporary while the tooltip is active. The next time it is shown again, the default content will be used.
Examples:
- Update content permanently (works even when the tooltip is not active):.poshytip('update', 'New permanent content')
- Update content temporary while the tooltip is active:.poshytip('update', 'Temporary content', true)
- .poshytip('disable')
- Disable the tooltip.
- .poshytip('enable')
- Enable the tooltip.
- .poshytip('destroy')
- Destroy completely the tooltip functionality.