aToolTip

DOWNLOAD DEMO

Quick Facts

 

Demos

Usage

Start off by including jQuery as well as the aToolTip plugin




Initiate the plugin

// initiate the plugin after DOM has loaded
$(function(){

	// basic usage
	$('a.normalTip').aToolTip();
	
	// fixed tooltip
	$('a.fixedTip').aToolTip({
		fixed: true
	});
	
	// on click tooltip with custom content
	$('a.clickTip').aToolTip({
		clickIt: true,
		tipContent: 'Hello I am aToolTip with content from param'
	});	
	
	// List of all paramaters and their default values:
	$('a').aToolTip({
		clickIt: false, 					// set to true for click activated tooltip
		closeTipBtn: 'aToolTipCloseBtn',	// you can set custom class name for close button on tooltip
		fixed: false,						// Set true to activate fixed position
		inSpeed: 400,						// Speed tooltip fades in
		outSpeed: 100,						// Speed tooltip fades out
		tipContent: '',						// Pass in content or it will use objects 'title' attribute
		toolTipClass: 'aToolTip',			// Set custom class for tooltip
		xOffset: 5,							// x Position
		yOffset: 5							// y position
	});
	
});

Basic HTML markup used in the demos


Normal Tooltip
Fixed Tooltip
On Click Tooltip

What does the tooltip markup look like?


Creative Commons License
This work is licensed under a Creative Commons Attribution 3.0 Unported License.