封装鼠标跟随tips

刚学习prototype.js的时候写的一个鼠标跟随提示的代码，后来在项目中发现一个很严重的问题，暂时没有修正。代码基于prototype.js v1.6。

代码打包下载

Javascript代码:

function handleTips(idElement) {
    this.handleBtn = (typeof idElement == 'string')? $(idElement) : idElement;
    this.popuptips = (typeof idElement == 'string')? $(idElement + "-tips") : idElement.id + "tips";
   
    this.handleBtn.onmouseover = this.showTips.bind(this);
    this.handleBtn.onmouseout = this.hiddenTips.bind(this);
    this.handleBtn.onmousemove = this.cursorPosition.bind(this);
}

handleTips.prototype.showTips = function() {
 //debugger;
 Element.show(this.popuptips);
 this.cursorPosition(arguments[0]);
}

handleTips.prototype.hiddenTips = function() {
        Element.hide(this.popuptips);
}

handleTips.prototype.cursorPosition = function(){
 
    var event = arguments[0] || window.event;
    this.arrPageSize = getPageSize();
    this.pageWidth = this.arrPageSize.PageWidth;
    this.pageHeight = this.arrPageSize.PageHeight;

   
    this.leftSpace = Event.pointerX(event) + 20;
    this.topSpace = Event.pointerY(event) + 20;

    this.rightSpace = this.pageWidth - this.leftSpace;
    this.bottomSpace = this.pageHeight - this.topSpace;
   
    this.tipsWidth = this.popuptips.getWidth();
    this.tipsHeight = this.popuptips.getHeight();

   
    if (this.tipsWidth < this.rightSpace && this.tipsHeight < this.bottomSpace) {
        this.popuptips.setStyle({
            left: Event.pointerX(event) + 20 + "px",
            top: Event.pointerY(event) + 20 + "px"
        });
    } else if(this.tipsWidth > this.rightSpace && this.tipsHeight < this.bottomSpace) {
        this.popuptips.setStyle({
            left: Event.pointerX(event) - this.tipsWidth - 20 + "px",
            top: Event.pointerY(event) + 20 + "px"
        });
    } else if(this.tipsWidth < this.rightSpace && this.tipsHeight > this.bottomSpace) {
        this.popuptips.setStyle({
            left: Event.pointerX(event) + 20 + "px",
            top: Event.pointerY(event) - this.tipsHeight - 20 + "px"
        });
    } else if(this.tipsWidth > this.rightSpace && this.tipsHeight > this.bottomSpace) {
        this.popuptips.setStyle({
            left: Event.pointerX(event) - this.tipsWidth - 20 + "px",
            top: Event.pointerY(event) - this.tipsHeight - 20 + "px"
        });
    }
}


function getPageSize() {
    var scrW, scrH;
    if(window.innerHeight && window.scrollMaxY) {
        // Mozilla
        scrW = window.innerWidth + window.scrollMaxX;
        scrH = window.innerHeight + window.scrollMaxY;
    } else if(document.body.scrollHeight > document.body.offsetHeight){
        // all but IE Mac
        scrW = document.body.scrollWidth;
        scrH = document.body.scrollHeight;
    } else if(document.body) {
        // IE Mac
        scrW = document.body.offsetWidth;
        scrH = document.body.offsetHeight;
    }
   
    var winW, winH;
    if(window.innerHeight) {
        // all except IE
        winW = window.innerWidth;
        winH = window.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) {
        // IE 6 Strict Mode
        winW = document.documentElement.clientWidth;
        winH = document.documentElement.clientHeight;
    } else if (document.body) { // other
        winW = document.body.clientWidth;
        winH = document.body.clientHeight;
    }
   
    // for small pages with total size less then the viewport
    var pageW = (scrW < winW) ? winW : scrW;
    var pageH = (scrH < winH) ? winH : scrH;
   
    return {PageWidth:pageW, PageHeight:pageH, WinWidth:winW, WinHeight:winH};
}

Event.observe(window, 'load', function() {new handleTips('note')});

CSS代码:

.tips {
    position: absolute;
    z-index: 9999;
    padding: 5px;
    background-color: #FFFFFF;
    border: 1px solid #FF6600;
}

#note {
 margin: 100px 0 0 300px;
}

#note-tips {
 width: 120px;
}