【jQuery】非常に小さなツールチップjQueryプラグインTinyTip

TinyTipはCSSはなく、非常に小さなツールチップjQueryプラグイン。

How To Use

<!-- first include jQuery library -->
<script src="./jQuery.js"></script>
<!-- Then tinytip plugin -->
<script src="./tinytip.js"></script>
$('.block.link').tinytip({
//position [top|bottom|left|right]
position : 'bottom',
//tooltip position fix [+-][yx]
fix : {
top : -10,
left: +20
},
//animation effect start position [+,-][top,left]
//example +10 => animate up 10 pixels
animation : {
top : +10,
left: -5,
},
//animation speed in milliseconds
speed : 100,
//tooltip text, or can be a jQuery object of
//selected element
tooltip : "Hi There" || $('.some-selector'),
//when to show tooltip event (default: mouseenter)
on : 'click',
//when to hide tooltip event (default: mouseleave)
off: 'click'
//prevent tooltip close when hover over it
preventClose : true,
//callback function fired once the tooltip completely loaded
//passes tooltip element jQuery object (e)
onLoad : function(e){
e.text('lool');
},
//add custom class to this tooltip
addClass : 'unique'
});

Options

  1. position
  2. fix
  3. animation
  4. speed
  5. easing
  6. tooltip
  7. on
  8. off
  9. preventClose
  10. onLoad
  11. addClass

MITライセンス

 
TinyTip

【jQuery】非常に小さなツールチップjQueryプラグインTinyTip

  • LATEST
  • RELATED
  • POPULAR