求js代码，能在右下角弹出小窗口，带过渡效果！

Question

消息提示，在浏览器的右下角慢慢往上滚出，就像qq的消息提示。可以关闭，并且浏览器大小的改变，不会影响它的位置，始终在右下角。求一段js代码！万分感谢！

Answer 1

悬浮的DIV css属性absolute(ff) fixed(ie)位置bottom:0px;right:0px;即可
至于能慢慢上移的效果 用js new一个time  然后每秒加一定height就行
具体思路就这样
代码满地都是

Answer 2

var bottom = 2;
    var right = 0;
    //size
    var width;
    var height;    var increment = 1; //popup moving high
    var objTimer;
    var adHtml;
    var exposeTime;
    var isExposed;
    var $IE = (navigator.appName == "Microsoft Internet Explorer");window.onload = function() {
    isExposed = true;
    createPopup();
    if (exposeTime == undefined) exposeTime = 5;
    window.setTimeout("log()", exposeTime);
}
function initial(html, w, h, time) {
    adHtml = html;
    width = w;
    height = h;
    exposeTime = time;
}
function log() {//used for log
    if (isExposed == true) {
        var container = $IE ? document.body : document.documentElement;
        var doc = document;
        var loger = doc.createElement("div");
        loger.innerHTML = "<img height='0' width='0' src='http://123.456.com' />";
        container.appendChild(loger);
    }
}
function createPopup() {
    //if doesn't initial
    if (width == undefined) width = 300;
    if (height == undefined) height = 200;
    
    //create popup adHolder
    var container = $IE ? document.body : document.documentElement;
    var doc = document;
    var p = doc.createElement("div");
    container.appendChild(p);
    p.style.cssText = "position:absolute;\
       z-index:9000;\
       overflow:hidden;\
       border:0px solid #f00;\
       ";
    p.id = "adHolder";
    setPosition(p, 0, height);    //create content
    var content = doc.createElement("div");
    p.appendChild(content);
    content.style.cssText = "position:absolute;\
       z-index:1;\
       overflow:hidden;";
    setSize(content, width, height);
    setPosition(content, 0, 0);
    content.innerHTML = adHtml;
    
    //create close button
    var btnClose = doc.createElement("a");
    btnClose.onclick = function() { closePopup(); }
    btnClose.onmouseover = function() { setAlpha(btnClose, 1); }
    btnClose.onmouseout = function() { setAlpha(btnClose, 0.4); }
    content.appendChild(btnClose);
    btnClose.style.cssText = 'position:absolute;\
        z-index:2;\
        font-size:0px;\
        line-height:0px;\
        right:0px;\
        top:0px;\
        width:15px;\
        height:13px;\
        cursor:pointer;\
        background-image:url("http://button.url.com/button.gif");';
    btnClose.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=40);";
    btnClose.style.opacity = 0.4;
    btnClose.style.MozOpacity = 0.4;
    showPopup();
}
function setAlpha(btn, a) {
    btn.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=" + a * 100 + ");";
    btn.style.opacity = a;
    btn.style.MozOpacity = a;
}
window.onresize = function() {
    showPopup();
}function showPopup(adHolder) {
    if (adHolder == undefined) adHolder = document.getElementById("adHolder");
    var t = document.documentElement;
    var dx = t.clientWidth + t.scrollLeft;
    var dy = t.clientHeight + t.scrollTop;
    var x = dx - right - width;
    var y = dy - bottom - increment;    setPosition(adHolder, x, y);
    setSize(adHolder, width, increment);
    if (adHolder.clientHeight < height) {
        increment++;
        window.clearInterval(objTimer);
        objTimer = window.setInterval("showPopup()", 5);
    }
}function closePopup() {
    document.getElementById("adHolder").style.display = "none";
    isExposed = false;
    if (objTimer) window.clearInterval(objTimer)
}
function setPosition(elmt, x, y) {
    elmt.style.left = x + "px";
    elmt.style.top = y + "px";
}
function setSize(elmt, x, y) {
    if ($IE) {
        elmt.style.width = x;
        elmt.style.height = y;
    }
    else {
        var clientSize = this.getClientSize(elmt);
        var dx = clientSize.left + clientSize.right;        var dy = clientSize.top + clientSize.bottom;        elmt.style.width = x - dx + "px";
        elmt.style.height = y - dy + "px";
    }
}
function getClientSize(n) {
    if ($IE) {
        var s = { x: n.clientLeft, y: n.clientTop };
        s.left = s.x;
        s.top = s.y;
        s.right = n.clientRight;
        s.bottom = n.clientBottom;
        s.width = n.clientWidth;
        s.height = n.clientHeight;
        return s;
    }
    else {
        var t = n.style;
        if (t.borderLeftWidth.length == 0 || t.borderTopWidth.length == 0 || t.borderRightWidth.length == 0 || t.borderBottomWidth.length == 0) {
            var l = n.offsetWidth;
            t.borderLeftWidth = "0px";
            l -= n.offsetWidth;
            var r = n.offsetWidth;
            t.borderRightWidth = "0px";
            r -= n.offsetWidth;            var o = n.offsetHeight;
            t.borderTopWidth = "0px";
            o -= n.offsetHeight;            var b = n.offsetHeight;
            t.borderBottomWidth = "0px";
            b -= n.offsetHeight;            t.borderLeftWidth = l + "px";
            t.borderTopWidth = o + "px";
            t.borderRightWidth = r + "px";
            t.borderBottomWidth = b + "px";
            var s = { left: l, right: r, top: o, bottom: b, x: l, y: o };
            return s;
        }
        else {
            var s = {
                x: this.parseInt(n.style.borderLeftWidth),
                y: this.parseInt(n.style.borderTopWidth),
                right: this.parseInt(n.style.borderRightWidth),
                bottom: this.parseInt(n.style.borderBottomWidth)
            };
            s.left = s.x;
            s.top = s.y;
            return s;
        }
    }
}

Answer 3

function yy(ll)
{
clearTimeout(the_timeout);
ccc=ll;
tt();
document.getElementById(ccc).style.left=30+"px";
document.getElementById(ccc).style.display="block";
}

Answer 4

参考http://user.qzone.qq.com/371395204/blog/1317956209
http://b213.photo.store.qq.com/psu?/335f413c-18ef-44d8-ad89-f5ee94492447/TgPYIs7I6YW6toQljCzOr5DQyXkGGuPbRuZEzl2cr38!/b/YRPE9n4kQQAAYkHU.X5gQQAA