infoBox Documentation

How to setup the plugin

View Demo   Download

Step 1 : Include JS Files



Step 2 : Include the HTML content

If you want to have an information sign to show the information box pop-up at the end of a paragraph, then include an anchor tag at the end of the paragraph. This anchor tag content will be data showing inside the information box. Once the plugin is initialized, this anchor tag will have an information sign and when mouse placed over this sign will show an information box pop-up with our intially entered anchor tag content

This will the paragraph content This will be the information box content

Step 3 : Initialize the plugin

$(document).ready(function(){
	$('#sampledata').infoBox();
});

Default Settings: Width of information pop-up box will be 200, position will be below the information sign, text color will be white and background color will be black

MORE OPTIONS

You can customize your information boxes with more options

$(document).ready(function(){
	$('#sampledata').infoBox({
		"width":300,	//width of information box pop-up
		"position":"above",	//position whether above or below the information sign
		"text_color":"white",	//color of the text	
		"bg_color":"grey"	//background color
	});	
});