$(function(){
	
	// 全要素をからTITLE属性を持っている要素だけに絞る
	$("#links *").filter(function(){
		return this.title && this.title.length>0;
	}).each(function(){
		// TITLE属性を持っている要素に適用する
		
		// あとで使う
		var self = $(this), title = self.attr("title");
		
		// TITLE属性を持っている要素にhover()で
		self.hover(
		
			// mouseover
			function(e){ // このeはevent自体を意味する
			
				// TITLEがあるとブラウザのチップが出るので一時的に空にしておく
				self.attr("title","");
			
				// とりあえず表示するtip要素を生成しておく
				$("body").append("<div id='title-tip'>"+title+"</div>");
				$("#title-tip").css({
					position: "absolute",
					
					// e.pageX(Y)でカーソルが要素に乗った時点でのX(Y)座標を取得する
					top: e.pageY+(-15), // カーソルと表示したtipが重なるとチラつくので少しずらす
					left: e.pageX+15
				});
			},
			
			// mouseout
			function(){
			
				// mouseoverで空にしたTITLEを戻す
				self.attr("title",title);
			
				// 要素から離れた場合はtipを非表示にして削除しておく
				$("#title-tip").hide().remove();
			}
		);
		
		// 要素上でカーソルが移動した場合は、逐一tipの位置を変える
		self.mousemove(function(e){
			$("#title-tip").css({
				top: e.pageY+(-15),
				left: e.pageX+15
			});		
		});
	});
			
});