SONHlab InfoTips

See SONHLAB InfoTips Documentation.

1. Positions

Hover texts below to show tooltips
BOTTOM LEFT
BOTTOM CENTER
BOTTOM RIGHT
TOP LEFT
TOP CENTER
TOP RIGHT
RIGHT TOP
RIGHT MIDDLE
RIGHT BOTTOM
 
LEFT TOP
LEFT MIDDLE
LEFT BOTTOM

2. Stickable

Click on "Click Me" text to stick the tooltip and click again to unstick
>>> Click Me <<<

3. Auto Show

This is demos of AutoShow

Auto Show 1
Auto Show 2
Auto Show 3

This is demos of AutoShow with Stick/unStick

Click on "Auto Show 4", " Auto Show 5", "Auto Show 6" to UnStick/Stick Tooltips
Auto Show 4
Auto Show 5
Auto Show 6

4. Animation Effects

This is demo of Animation Effects

5. Ajax Load

6. Other Examples

IMAGE
VIDEO
IFRAME
TIP IN TIP
            $('#tooltip-bottomrgiht').SONHlabTooltip({
TooltipPosition:'BottomRight',
TooltipStyle:'light',
TooltipBackground:'#FEE9AE',
TooltipWidth:500
});
            $('#tooltip-bottomcenter').SONHlabTooltip({
TooltipPosition:'BottomCenter',
TooltipStyle:'light',
TooltipBackground:'#FEE9AE',
TooltipWidth:500 });
            $('#tooltip-bottomleft').SONHlabTooltip({
TooltipPosition:'BottomLeft',
TooltipStyle:'light',
TooltipBackground:'#FEE9AE',
TooltipWidth:500
});
            $('#tooltip-topright').SONHlabTooltip({
TooltipPosition:'TopRight',
TooltipStyle:'dark',
TooltipBackground:'#333',
TooltipWidth:500
});
            $('#tooltip-topcenter').SONHlabTooltip({
TooltipPosition:'TopCenter',
TooltipStyle:'dark',
TooltipBackground:'#333',
TooltipWidth:500
});
            $('#tooltip-topleft').SONHlabTooltip({
TooltipPosition:'TopLeft',
TooltipStyle:'dark',
TooltipBackground:'#333',
TooltipWidth:500
});
            $('#tooltip-lefttop').SONHlabTooltip({
TooltipPosition:'LeftTop',
TooltipStyle:'light',
TooltipBackground:'#fff',
TooltipWidth:500
});
            $('#tooltip-leftmiddle').SONHlabTooltip({
TooltipPosition:'LeftMiddle',
TooltipStyle:'light',
TooltipBackground:'#fff',
TooltipWidth:500
});
            $('#tooltip-leftbottom').SONHlabTooltip({
TooltipPosition:'LeftBottom',
TooltipStyle:'light',
TooltipBackground:'#fff',
TooltipWidth:500
});
            $('#tooltip-righttop').SONHlabTooltip({
TooltipPosition:'RightTop',
TooltipStyle:'light',
TooltipBackground:'#fff',
TooltipWidth:500
});
            $('#tooltip-righttop').SONHlabTooltip({
TooltipPosition:'RightMiddle',
TooltipStyle:'light',
TooltipBackground:'#fff',
TooltipWidth:500
});
            $('#tooltip-righttop').SONHlabTooltip({
TooltipPosition:'RightBottom',
TooltipStyle:'light',
TooltipBackground:'#fff',
TooltipWidth:500
});
$('#tooltip-righttop').SONHlabTooltip({
    TooltipPosition:'RightBottom',
    TooltipStyle:'light',
    TooltipBackground:'#fff',
    ClickableTooltip:1,
    TooltipWidth:400
});

$('#tooltip-autoshow1').SONHlabTooltip({
TooltipPosition:'TopRight',
TooltipStyle:'light',
TooltipBackground:'#7FFF00',
AutoShow:1,
TooltipWidth:280
});

$('#tooltip-autoshow2').SONHlabTooltip({
TooltipPosition:'TopCenter',
TooltipStyle:'light', TooltipBackground:'#FFE7BA',
AutoShow:1,
TooltipWidth:280
});

$('#tooltip-autoshow2').SONHlabTooltip({
TooltipPosition:'TopLeft',
TooltipStyle:'light', TooltipBackground:'#E9967A',
AutoShow:1,
TooltipWidth:280
});

$('#tooltip-autoshow4').SONHlabTooltip({
TooltipPosition:'TopRight',
TooltipStyle:'light',
TooltipBackground:'#E0FFFF',
ClickableTooltip:1,
AutoShow:1,
TooltipWidth:280
});

$('#tooltip-autoshow5').SONHlabTooltip({
TooltipPosition:'TopCenter',
TooltipStyle:'light',
TooltipBackground:'#FF6EB4',
ClickableTooltip:1,
AutoShow:1,
TooltipWidth:280
});

$('#tooltip-autoshow5').SONHlabTooltip({
TooltipPosition:'TopLeft',
TooltipStyle:'light',
TooltipBackground:'#F5F5DC',
ClickableTooltip:1,
AutoShow:1,
TooltipWidth:280
});

$('#tooltip-fadeeffect').SONHlabTooltip({
TooltipPosition:'RightMiddle',
TooltipStyle:'light',
TooltipBackground:'#fff',
ClickableTooltip:1,
showEffect:'fade',
TooltipWidth:500 });

Lorem Ipsum is simply dummy text of the printing and typesetting industry

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

6. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.