Easy Tooltip jQuery Plugin Demo

Easy Tooltip using an element from the page

This plugin can use any element on the page, take it's inner HTML and display in the tooltip. Roll over this link to view it in action
Note: The best way to use this principle is to initialy hide the element you are taking the content from.

Usage

$(document).ready(function(){	
	$("a").easyTooltip({
		useElement: "item"	
	});
});

CSS

#easyTooltip{
	margin:0 10px 1em 0;
	width:250px;
	padding:8px;
	background:#fcfcfc;
	border:1px solid #e1e1e1;
	line-height:130%;				
	}
#easyTooltip h3{
	margin:0 0 .5em 0;
	font:13px Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	}	
#easyTooltip p{
	margin:0 0 .5em 0;
	}		
#easyTooltip img{
		background:#fff;
		padding:1px;
		border:1px solid #e1e1e1;
		float:left;
		margin-right:10px;
		}		

#item{display:none;}

back to the article

Easy Tooltip jQuery Plugin is brought to you by Css Globe and supported by Css Templates by Templatica

Item title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi at dui. Pellentesque nec augue vitae magna tincidunt imperdiet. Etiam at nisl ut felis pellentesque rhoncus.