Amit Dhamu

Writes Code

HTML5 Desktop Notifications

/* Text Notification */
<a id="showNotification" href="javascript:void(0);">Plain Text Notification</a>


/* HTML Notification */
<a id="showHTMLNotification" href="javascript:void(0);">HTML Notification</a>


$("#showNotification").click(function() {
    Notification("Title", "Description", "text");
)};

$("#showHTMLNotification").click(function() {
    Notification("", "https://www.google.co.uk", "html");
)};


function Notification(title, content, type) {
   if(!window.webkitNotifications) {
        /* Don't do anything. This browser does not support desktop notifications */
    } else {
        if(window.webkitNotifications.checkPermission() == 0) {
           switch(type) {
                case "text":
                    var notify = window.webkitNotifications.createNotification('icon.png', title, content);
                 break;
                case "html":
                    var notify = window.webkitNotifications.createHTMLNotification(content);
                  break;
            }
         notify.show();

                /* Timeout Notification Display (optional) */
           setTimeout(function() {
               notify.cancel();
          }, '15000');

     } else {
          window.webkitNotifications.requestPermission();
       }
    }
}


html5 / jquery

← Outlook Calendar Event Get Site Favicon →