Aタグのテキストボックスにホバーを作成するjqueryプラグインがあります。
プラグインは、A タグの「タイトル属性」からテキストを抽出し、それを div タグ (#hoverText と呼ばれる) に配置することによって機能します。#hoeverText div タグは、A タグの X および Y 座標から 10 ピクセルになるように「絶対に配置」されます。
ただし、コードのこの部分が機能しておらず、修正方法がわかりません。hoverText div タグは、ページの上部にとどまっているようです。したがって、ページの下部に A タグがある場合、hoverText div タグはページの上部にあるため表示されません。
プラグインのコピーをこのページの下部に配置しました。アドバイスやヘルプをいただければ幸いです。
(function ($) {
$.fn.hoverText= function() {
$(this).after('<div id="hoverText"></div>' );
// if (title != undefined || title != ''){
$(this).mouseover(function(){
title = $(this).attr ('title');
$(this).attr( 'title', '');
}).mousemove(function(e) {
var top= e.clientY + 10;
var left= e.clientX + 10;
// $('#pos').text(top + ' ' + left );
$('#hoverText').css('top', top).css('left', left ).text(title).show();
}).mouseout(function() {
$(this).attr('title', title );
$('#hoverText').hide();
});
}
}) (jQuery);