Options

position


$(".tooltip").asTooltip({
		show: { target: '.position_tooltip' },
		hide: { target: '.position_tooltip' }
});
Top Left Top Middle Top Right Left Top None Right Top Left Middle None Right Middle Left Bottom None Right Bottom Bottom Left Bottom Middle Bottom Right

Trigger


$(".tooltip-click").asTooltip({
		show: { event: 'click' },
		hide: { event: 'click' }
});
click show 

$(".tooltip-click-outer").asTooltip({
		show: { event: 'click' },
		hide: {
				event: 'click',
				container: 'body'
		}
});
click show
focus to show

$(".tooltip-focus").asTooltip({
		show: { event: 'focus' },
		hide: { event: 'blur' }
});

Ajax


$(".tooltip-ajax").asTooltip({
		ajax: function(api) {
				$.ajax({
						type: 'GET',
						url: 'data/data.json',
						dataType: 'json',
						success: function(data, type) {
								api.options.content = data.content;
								api.setContent();
						}
				});
		}
});
ajax content

No Data


$(".tooltip-ajax").asTooltip({
		ajax: function(api) {
				$.ajax({
						type: 'GET',
						url: 'data/data2.json',
						dataType: 'json',
						success: function(data, type) {
								api.options.content = data.content;
								api.setContent();
						}
				});
		}
});
ajax content

Mosuce Trace


$(".tooltip-mouseTrace").asTooltip({
		position: {
				target: 'mouse',
				adjust: {
						mouse: true
				}
		}
});
mouseTrace area 

$(".tooltip-mouseTrace-noAdjust").asTooltip({
		position: {
				target: 'mouse',
				adjust: {
						mouse: false
				}
		}
});
mouseTrace area 

$(".tooltip-positionTarget1").asTooltip({
		position: {
				target: $('.tooltip-positionTarget2')
		}
});
hover area show area

Delay


$(".tooltip-showDelay").asTooltip({
		show: { delay: 500 }
});
showDelay when move in 

$(".tooltip-hideDelay").asTooltip({
		hide: { delay: 500 }
});
hideDelay when move out

HideInactive


$(".tooltip-ajax").asTooltip({
		hide: { inactive: true }
});
hideInactive with tip 

$(".tooltip-hideInactive-hideDelay").asTooltip({
		hide: {
				inactive: true,
				delay: 500
		}
});
hideDelay when move out

PositionContainer


$(".tooltip-positionContainer").asTooltip({
		position: { contianer: '.tooltip-positionContainer-wrap' }
});

Add HTML into contianer.

positionContainer

Autoposition


$(".tooltip-autoPosition").asTooltip({
		position: { auto: true }
});
Autoposition 

$(document).ready(function() {
		$(".tooltip-pos1").asTooltip({
				position: {
						container: '.tooltip-poswrap1',
						auto: true
				}
		});
});
autoPos1
autoPos2
autoPos3
autoPos4
autoPos5

Skin


$(".tooltip-skin").asTooltip({
		skin: 'sea'
});
I have a 'sea' skin

API


var api = $("#api_tooltip").asTooltip();
$('#api_show').on('click',function(){
		api.show();
});
$('#api_hide').on('click',function(){
		api.hide();
});
$('#api_update').on('click',function(){
		api.update();
});
$('#api_disable').on('click',function(){
		api.disable();
});
$('#api_enable').on('click',function(){
		api.enable();
});
$('#api_destroy').on('click',function(){
		api.destroy();
});
I have a tooltip