您好,欢迎来到三六零分类信息网!老站,搜索引擎当天收录,欢迎发信息
免费发信息

js网页右下角提示框实例_javascript技巧

2024/5/16 3:05:26发布5次查看
本文实例讲述了js网页右下角提示框的实现方法,分享给大家供大家参考。具体方法如下:
html代码部分如下:
复制代码 代码如下:
×
系统提示:
内容
js代码部分如下:
复制代码 代码如下:
function messagetip(pjso) {
    _.init(this, pjso, {
        name: 'msg'//提示框标签id
    });
    this.emsg = document.getelementbyid(this.name);
}messagetip.prototype =
{
    //提示框始终在最右下角
    reposition: function(_this) {
        var divheight = parseint(_this.emsg.offsetheight, 10);
        var divwidth = parseint(_this.emsg.offsetwidth, 10);
        var docwidth = document.body.clientwidth;
        var docheight = document.body.clientheight;
        _this.emsg.style.top = docheight - divheight + parseint(document.body.scrolltop, 10);
        _this.emsg.style.left = docwidth - divwidth + parseint(document.body.scrollleft, 10);
    },
    //提示框慢慢往上升
    movediv: function(_this) {
        /*
        这里可以设置自动几秒后关闭
        ...
        */
        try {
            if (parseint(_this.emsg.style.top, 10)                 window.clearinterval(_this.objtimer);
                _this.objtimer = window.setinterval(function() { _this.reposition(_this); }, 1);
            }
            _this.divtop = parseint(_this.emsg.style.top, 10);
            _this.emsg.style.top = _this.divtop - 1;
        }
        catch (e) {
        }
    },
//关闭提示框
    close: function() {
        this.emsg.style.visibility = 'hidden';
        if (this.objtimer) window.clearinterval(this.objtimer);
    },
    //显示提示框
    show: function() {
        var divtop = parseint(this.emsg.style.top, 10);
        this.divtop = divtop;
        var divleft = parseint(this.emsg.style.left, 10);
        var divheight = parseint(this.emsg.offsetheight, 10);
        this.divheight = divheight;
        var divwidth = parseint(this.emsg.offsetwidth, 10);
        var docwidth = document.body.clientwidth;
        var docheight = document.body.clientheight;
        this.docheight = docheight;
        this.emsg.style.top = parseint(document.body.scrolltop, 10) + docheight + 10;
        this.emsg.style.left = parseint(document.body.scrollleft, 10) + docwidth - divwidth;
        this.emsg.style.visibility = visible;
        var _this = this;
        this.objtimer = window.setinterval(function() { _this.movediv(_this); }, 10);
    }
}
var msgtip = new messagetip({ name: 'emeng' });
window.onload = function() { msgtip.show(); };
window.onresize = function() { msgtip.reposition(msgtip); };
希望本文所述对大家的web程序设计有所帮助。
该用户其它信息

VIP推荐

免费发布信息,免费发布B2B信息网站平台 - 三六零分类信息网 沪ICP备09012988号-2
企业名录