我使用svg与Raphael建立了一个网站http://zielonyzoliborz.pl/，当任何建筑工具提示鼠标悬停显示在屏幕上时（FF，Chrome，Safari），但是在IE9和Opera中我没有为我设置标准标题IE8有效，但不是上述浏览器
我使用Raphael.js设置一个简单的标题，例如：
paper.path("M1345.5,413.5l0.125-31.125L1256.5,371l-18,22.5l1,22L1038,389.333l-3,3.333l-62,53V454 l-13,11.333v34.333l-42.333-7l-85.333,77v8.667l-14,12v95L821,689v5.25l3.25,2.75v9h5.5l1.25-5.25V697l3-2l2.75-3.875l2-2.625v-4.75 l3-3l3.5-2.75l6.5,0.25l1.75,1.25l2.5,1.75l2.75,4.75v4v2.25V694l2.5,2.25V701v5.75v3.75v2.5l3,1.25H867v-4.75V703v-4.25v-6.25 l2.75-2l1.25-6l3.25-2.5l2.25-5.75h4h3.75l2.5,4.75l1.75,3l1.25,3v5.75l2.5-2.75l3.25-0.25l4-3.25l2.25-1h3.5l3.25,0.75l1.5-4.5 c0,0,3.75-1.5,4.5-0.5s3,1.75,3,2.5s0.75,3,1.75,3.25s4.5,2.5,4.5,2.5s-0.25,3.75,0,4.5s1.25,4.25,1.25,4.25l2,2.5 c0,0,5,0.75,5.75,1s3-1.25,3-1.25l1.5-3.5l3-1.75l2-2.75H945l3.25,0.25h4.25l2.75-1l2.5,1.5c0,0,1.5,3.25,2.25,4s4,4.5,4,4.5 l2.25,4.5l1.75,1.25l4.75-0.5l2.25-4.75v-3.5l3-1.5l3.75,0.25c0,0,3.25,2.25,3.25,3.25s3.5,4.5,3.5,4.5l1.5,4.5l1.5,5.75l2,5v5.25 l3,2h3.25l3.75-2.5h3.75l2.5-1.5l2.5-2.75h3.75l4.75,2.75v3v4L1024,734v5.25v3.25v2l4.25-4.75c0,0,3-1.25,4-1.25s5.25-1,5.25-1 l-2-4.75l2-2.25l2-1.75l-5.75-2.5l-0.25-4l3-1.25l1.25-4.75l3-2.25l4.25-2.5l3.5-1.125l5,1.125l4,3l4.25,3l2.25,4l2.5,2v5.5l4,3.75 l2,2.75l1.75-0.25l2.75-2l1.25-4.75l3.25-4.25l2.5-3.25l2.729-2.25l2.021-2.25h3.75l3.5,1.5l3,3.5v5l2.5,1.25l1.75-3.25l4.25-1.5 h3.5l4.5,3.25l2.75,4.75l1.5,3.75l3.75,0.75l3,3.25l5.75,5.75l1.75,2.25l1.25,3.5v5.25l2.5,2.25l2.25,2.75h8.25h4.25l3.75,1.75 l3,2.5V767l3.25,4.75l2-4.5l3.75-3l2.5-8.5v-4.25c0,0,3.25-2.25,3.25-3s3.5-3.75,3.5-3.75l3.75-1.75l2-3.25V736l5.25-1.5l5-4.75h3.5 l3.25,1l2.75,2.5l3,2.5l1.25,6l1.5,3.5V749c0,0,2,2.5,1.75,3.25s-1,5.5-1,5.5l1.021,6c0,0,0.838,1.598,1.66,2.892l142.326-236.143 l0.617-116.749L1345.5,413.5z M1116,536h-4.667l0.042,6.375l-13.375,14.5v22.375l-68-10.917l35-41.667l26.667,5l5.666-2.667 l3.709-1.854l4.958-0.083l5.125,0.688l3.542,2.583l3,2.667L1116,536z").attr({
"fill":"#FBA919",
"stroke-width":0,
"fill-opacity":0,
"stroke":"transparent",
"cursor":"pointer",
"title":"Budynek B"
}).mouseover(
function(){
this.animate({
"fill-opacity":.4
},300);
}).mouseout(function(){
this.animate({
"fill-opacity":0
},300);
});
和easytooltip.js显示图形标题（FF.Chrome，Opera）
$('svg a:nth-child(21)').easyTooltip({
tooltipId:"budynek-b",
yOffset:90,
xOffset:-44,
});
#budynek-b{
background:url(../img/zz_budynekB_smal.png) no-repeat center center;
width:60px;
height:86px;
overflow:hidden;
text-indent:-9999px;
z-index:1000000
}
答案 0 :(得分：0)
您的代码中存在javascript错误（这是从Opera Dragonfly调试工具中复制的）：
Uncaught exception: TypeError: Cannot convert 'b' to objectError thrown at line 1210, column 3 in <anonymous function: _getDisplayTextForRecordField>(b, a) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
var c = this.options.fields[a],
called from line 1155, column 3 in <anonymous function: _createCellForRecordField>(b, a) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
return c('<td class="' + this.options.fields[a].listClass + '"></td>').append(this._getDisplayTextForRecordField(b, a) || "")
called via Function.prototype.apply() from line 2476, column 3 in <anonymous function: _createCellForRecordField>(a, b) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
var c = d.apply(this, arguments);
called from line 1152, column 4 in <anonymous function: _addCellsToRowUsingRecord>(b) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
this._createCellForRecordField(b.data("record"), this._columnList[a]).appendTo(b)
called via Function.prototype.apply() from line 1757, column 3 in <anonymous function: _addCellsToRowUsingRecord>(a) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
f.apply(this, arguments);
called via Function.prototype.apply() from line 1990, column 3 in <anonymous function: _addCellsToRowUsingRecord>(a) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
f.apply(this, arguments);
called via Function.prototype.apply() from line 2120, column 3 in <anonymous function: _addCellsToRowUsingRecord>(a) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
f.apply(this, arguments)
called from line 1147, column 3 in <anonymous function: _createRowFromRecord>(b) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
this._addCellsToRowUsingRecord(b);
called from line 1160, column 4 in <anonymous function: _addRecordsToTable>(b, d) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/plugins.js:
a._addRowToTable(a._createRowFromRecord(d))
called via Function.prototype.call() from line 608, column 7 in <anonymous function: each>(a, c, d) in http://zielonyzoliborz.pl/wp-content/themes/zielonyzoliboz/js/jquery-1.7.2.min.js:
if (c.call(a[g], g, a[g++]) === !1)
我的猜测是缺少的工具提示与该错误有关。
更新：好的，在修复之后我又看了一眼，问题是title元素上<svg:a>属性的命名空间。如果使用名称空间感知方法来访问属性，它就可以工作。
黑客/解决方法是这样的：
var title = $(this).attr("title") || this.getAttributeNS("http://www.w3.org/1999/xlink", "title");
这将放在您的plugin.js脚本中（显示修改后的代码）：
$.fn.easyTooltip = function(options){
// default configuration properties
var defaults = {
xOffset: 10,
yOffset: 25,
tooltipId: "easyTooltip",
clickRemove: false,
content: "",
useElement: ""
};
var options = $.extend(defaults, options);
var content;
this.each(function() {
var title = $(this).attr("title") || this.getAttributeNS("http://www.w3.org/1999/xlink", "title");
$(this).hover(function(e){
content = (options.content != "") ? options.content : title;
content = (options.useElement != "") ? $("#" + options.useElement).html() : content;
$(this).attr("title","");
if (content != "" && content != undefined){
$("body").append("<div id='"+ options.tooltipId +"'>"+ content +"</div>");
$("#" + options.tooltipId)
.css("position","absolute")
.css("top",(e.pageY - options.yOffset) + "px")
.css("left",(e.pageX + options.xOffset) + "px")
.css("display","none")
.fadeIn("fast")
}
},
如果jQuery getAttributeNS方法失败，那么这里的更改是回退到.attr（隐藏浏览器差异这么多？）。有了它，它至少在Opera中起作用。真正的更好的解决方法是确保设置属性的位置将它们设置在空命名空间中，例如elm.setAttributeNS(null, "title", "some-value")或使jQuery命名空间感知（我不认为发生这种情况的可能性是但是特别大。）