比如 : 鼠标移到 福州 字体上 就弹出相应的 XX市 XX市 XX市 请问怎么实现?

Question

比如 :  鼠标移到 福州 字体上 就弹出相应的 XX市 XX市  XX市   请问怎么实现?

Answer 1

**************************************************************************************************
*　描述：一个Tooltip类
*　使用方法：
*　　在任意有　onmouseover　onmouseout　onmousemove　方法的标签加上 tooltipHtml 属性
*　　tooltipHtml 的值为要提示的文本
*　作者：钟国勇
*　时间：2007-01-10
***************************************************************************************************/
var Tooltip;
function Tooltip(){
    Tooltip = this;
}
Tooltip.prototype = {   
    Version : '1.0.0',   
    className : '',
    width : '',
    height : '',
    mouseX: '10',
    mouseY: '0',
    //显示提示的容器
    tipContainer : '',
   
    //显示提示
    ShowTip : function(){
        //var arr = eval('{' + this.tooltipHtml + '}');
        Tooltip.tipContainer.innerHTML = this.getAttribute('tooltipHtml');
        Tooltip.tipContainer.style.display = '';
        var l = event.clientX + parseInt(Tooltip.mouseX);
        var r = event.clientY - parseInt(Tooltip.mouseY) + document.documentElement.scrollTop;
        if((l + parseInt(Tooltip.width) + parseInt(Tooltip.mouseX)*3)> window.screen.width)
        {
            l = event.clientX - parseInt(Tooltip.width) - parseInt(Tooltip.mouseX)*2;
        }       
       
        Tooltip.tipContainer.style.left = l;
        Tooltip.tipContainer.style.top = r;
    },
    //隐藏提示
    HideTip : function(){
        Tooltip.tipContainer.style.display = 'none';
    },
    //写出提示框
    CreateTip : function(){   
        this.tipContainer = document.createElement('div');
        this.tipContainer.id = 'Tooltip$DivTipHtml'; 
        this.tipContainer.className = this.className;
        this.tipContainer.style.width = parseInt(Tooltip.width);
        this.tipContainer.style.display = 'none';
        this.tipContainer.style.position = 'absolute';
        this.tipContainer.innerHTML = '{0}';
        document.body.appendChild(this.tipContainer);
    },
   
    //类初始化
    Init : function(){
        var objArr = document.getElementsByTagName("*");
        var j = 0;
        for(var i = 0; i < objArr.length; i++)
        {
            var tip = objArr[i].getAttribute('tooltipHtml');
           
            if(tip == 'undefined' || tip == null)
            {
                continue;
            }             
            objArr[i].onmouseover = this.ShowTip;
            objArr[i].onmouseout = this.HideTip;
            objArr[i].onmousemove = this.ShowTip;
            j++;
        }
        if(j > 0)
        {
            this.CreateTip();
        }
    }
   
}
var tool  = new Tooltip();
tool.className = 'divBox';
tool.width = '200';
tool.mouseX = '10';
tool.mouseY = '0';
tool.Init();