Question

什么是Webkit / Html Notification的跨浏览器替代品，最好是在jquery / css中。我基本上想要一些可以从页面右下角弹出的东西，比如webkit通知

Answer 1

这是一个可以给你一些想法的小演示......

基本上我正在使用fixed位置div来创建一个小框，该框可以在某个事件触发的页面上滑入视图（在此示例中单击时）。

Answer 2

function notify(msg, delay) {
    var box = document.createElement('DIV');
    box.id = 'notification';
    // you should just style #notification in css, but w/e
    box.style.position = 'fixed';
    box.style.bottom = '10px';
    box.style.right = '10px';
    box.style.width = '200px';

    box.innerHTML = msg;
    document.body.appendChild(box);
    setTimeout(function() {
        box.parentNode.removeChild(box);
    }, delay);
}

使用它像：

notify('sup dude', 1000);

编辑：Jquery版本：

function notifyJquery(msg, delay) {
    $("body").append('<div id="notification" />').css({
        'display': 'none',
        'position': 'fixed',
        'bottom': '10px',
        'right': '10px'
    }).text(msg).fadeIn(400).delay(delay).fadeOut(400);
}

notifyJquery('sup dude', 1000);

跨浏览器替代Webkit / Html通知

2 个答案: