タイトル属性文字列を使用するツールチップ用の次の JQuery コードがあります。私の問題は、ブラウザーのツールチップも表示され、これを回避する方法がわからないことです。
function Tooltip() {
Form.append('<div class="Tooltip"></div>');
$('input, textarea, select, p, label').mousemove(function(e) {
var HoverText = $(this).attr('title');
var Tooltip = $('.Tooltip');
if(HoverText){
Tooltip.html(HoverText).fadeIn(100);
Tooltip.css('left', e.clientX + 15).css('top', e.clientY + 15);
}
}).mouseout(function() {
var Tooltip = $('.Tooltip');
Tooltip.fadeOut(100);
});
}
ありがとうございました!
アップデート:
title 属性が削除され、値は $.data に保存されます。残念ながら、mousemove 機能はこのようには機能しません...
function Tooltip() {
Form.append('<div class="Tooltip"></div>');
$('input, textarea, select, p, label').mousemove(function(e) {
$(this).data('title', $(this).attr('title')).removeAttr('title');
var HoverText = $(this).data('title');
var Tooltip = $('.Tooltip');
if(HoverText){
Tooltip.html(HoverText).fadeIn(100);
Tooltip.css('left', e.clientX + 15).css('top', e.clientY + 15);
}
}).mouseout(function() {
var Tooltip = $('.Tooltip');
Tooltip.fadeOut(100);
$(this).attr('title', $(this).data('title'));
});
}