fare metin üzerine gelince metin çıkarma

arkadaşlar "ali" kelimesinin üzerine fare gelince küçük bir pencerede "Ali bu dönem beş kitap okudu" metnin çıkması için nasıl bir kod yazılır. bilen arkadaşlar yazabilirler mi acaba...

<style type="text/css">
.font-on{
	display:none;
	position:absolute;
	margin-top:-40px;
	background:#FFF;
	border:1px solid #000;
}
.font:hover .font-on{
	display:block;
}
</style>
<br>
<br>
<div class="font">Ali <div class="font-on">Ali bu dönem beş kitap okudu</div></div>

Kolay gelsin.

http://tutorialzine.com/2010/07/colo...ooltip-plugin/

İşinize yarayabilir.

Pluginsiz normal html ile yazı çıkarmak istiyorsanız bunun için title tagını kullanabilirsiniz örnek olarak <p title="Ali bu dönem beş kitap okudu">Ali</p> . Bunun haricinde Daha Profesyonel birşey isterseniz @masumm'un önerdiği plugini bende tavsiye ediyorum size

Direk bu işin tagı var -> http://www.w3schools.com/tags/tag_abbr.asp

Ama dersenizki tagla yapmıyorum daha şekilli olsuın o zaman "jQuery tooltip" araması yapınız