JS 工具提示效果(tool tips)

一个非常简单的可自定义的工具提示效果，只有一个可选参数为延迟出现的时间，默认为无延迟。
/******************************
*
* Name: toolTips
* Author: Aken li
* Date: 2008.07.10
* Blog: www.kxbd.com
*
******************************/
var toolTips = Class.create();
toolTips.prototype = {
    initialize:function(delayDur){
        this.wrapperId = "toolTipsWrapper";
        this.show = false;
        this.xGap = 10;
        this.yGap = 10;
        this.opacity = 0.9;
        this.delayDur = delayDur || 0;
        this.init();
    },

    init:function() {
        this.insertWrapper();
        document.observe("mouseover", this.showToolTips.bind(this));
        document.observe("mouseout", this.hideToolTips.bind(this));
        document.observe("mousemove", this.moveToolTips.bind(this));
    },

    insertWrapper:function() {
        $(document.body).insert(new Element("div",{'id':this.wrapperId,'style':'position: absolute;display: none;width:auto;z-index: 10000;'}));
        $(this.wrapperId).setStyle({opacity:this.opacity});
    },

    showToolTips:function(e) {
        var el = e.element();
        var o = $(this.wrapperId);
        if(el.title){
            el.toolTip = el.title;
            el.title = "";
        };
        if(el.toolTip){
            o.update(el.toolTip).show.bind(o).delay(this.delayDur);
            this.show = true;
        }
    },

    hideToolTips:function(e) {
        var el = e.element();
        var o = $(this.wrapperId);
        o.setStyle({left:"-1000px",display:"none"})
        this.show = false;
    },

    moveToolTips:function(e) {
        if(this.show){
            var x = e.pointerX();
            var y = e.pointerY();
            var x1 = this.xGap;
            var y1 = this.yGap;
            var o = $(this.wrapperId);
            var dims = o.getDimensions();
            var oW = dims.width;
            var oH = dims.height;
            var docDims = document.viewport.getDimensions();
            var docW = docDims.width;
            var docH = docDims.height;
            var docScroll = document.viewport.getScrollOffsets();
            var docLeft = docScroll.left;
            var docTop = docScroll.top;
           
            //var posX=(x+x1+oW-docLeft>docW) ? docW+docLeft-oW : x+x1;
            //var posY=(y+y1+oH-docTop>docH) ? docH+docTop-oH : y+y1;

            var posX=(x+x1+oW-docLeft>docW) ? x-oW-x1 : x+x1;
            var posY=(y+y1+oH-docTop>docH) ? y-oH-y1 : y+y1;

            o.setStyle({
                left: posX+"px",
                top: posY+"px"
            })
        }
    }
};

转自： http://www.kxbd.com/article.asp?id=218