Всплывающая подсказка

[mrKot]

У меня вот есть такой код,

var myhtml = {
    	title: function(id, text, prefix_id, pad_left, pad_top) {
    		if(!pad_left) pad_left = 30;
    		if(!pad_top) pad_top = 50;
    		$("body").append('<div id="' + prefix_id + id + '"><div id="js_title_' + id + '" class="js_titleRemove"><div id="easyTooltip">' + text + '</div><div class="tooltip"></div></div></div>');
    		xOffset = $('#' + prefix_id + id).offset().left - pad_left;
    		yOffset = $('#' + prefix_id + id).offset().top - 30;
    		yOffset = yOffset + pad_top;
    		$('#js_title_' + id).css("position", "absolute").css("top", yOffset + "px").css("left", xOffset + "px").css("display", "none").css("z-index", "1000").css("max-width", "350px").fadeIn('fast');
    		$('#' + prefix_id + id).mouseout(function() {
    			myhtml.title_close(id);
    		});
    	},
    	title_close: function(id) {
    		$('#js_title_' + id).remove();
    	}
    }


myhtml.title('', 'Текст', 'stats', 70)

Как сделать чтоб можно было навести на подсказку и она не пропала пока с неё не уберешь курсор?

[nesnayka]

А чем обычный атрибут title не устраивает?
Зачем усложнять код JS-ом и перегружать страницу?
Если хотите стилизованную подсказку, то тоже можно обойтись без JS, чисто средствами CSS.
class1 - класс блока к которому нужна подсказка
class2 - класс с самой подсказкой.

<style  type="text/css">
.class2 {
 display:none; 
}
.class1:hover .class2{
 display:block;
}
</style>

<div class="class1">Постоянное содержимое<div class="class2">Всплывающее содержимое</div></div>

Блок с подсказкой должен быть внутри блока, реагирующего на наведение.

[mrKot]

не годится так

[nesnayka]

не годится так

Почему?
Какие причины непригодности?