Jquery get Desktop Notification when page loaded

Question

I use this code to get desktop notification on chrome by click on div

<script>
function notify() {
var havePermission = window.webkitNotifications.checkPermission();
if (havePermission == 0) {
  // 0 is PERMISSION_ALLOWED
   var notification = window.webkitNotifications.createNotification(
  'https://i.stack.imgur.com/dmHl0.png',
  'Chrome notification!',
  'Here is the notification text'
);

   notification.onclick = function () {
  window.open("http://stackoverflow.com/a/13328397/1269037");
  notification.close();
  }
  notification.show();
  } else {
  window.webkitNotifications.requestPermission();
 }
 }  
</script>

  <div style="width: 300px; height: 300px; background: yellow" onclick="notify()">
  Cick here to notify
  </div>

but when I changed onclick to onload not work

I use jquery too in this code even using click event or ready what is problem with that?

score 1 · Answer 1 · answered Mar 25 '14 at 16:46

I found answer I use this one

<script  type="text/javascript">
var DesktopNotifications = {
/**
 * Checks if notifications are supported
 * @return {Boolean}
 */
isSupported:function() {
    return (window.webkitNotifications != 'undefined')
},
/**
 * ask use to display desktop notifications
 * @param callback
 */
requestPermission:function(callbck) {
    window.webkitNotifications.requestPermission(function() {
        if (typeof(callbck) == "function") {
            callbck(window.webkitNotifications.checkPermission() == 0);
        }
    });
},
/**
 * display a notification
 * @param img full path of image to be displayed e.g. http://somedomain.com/photo.jpg
 * @param notitification_title title of notification
 * @param notification_body body of nitification
 * @return {Boolean}
 */
doNotify:function(img,notitification_title,notification_body) {
    // permission is ok
    if (window.webkitNotifications.checkPermission() == 0) {
        window.webkitNotifications.createNotification(img, notitification_title, notification_body).show();
        return true;
    }
    return false;
}
   }

 $(document).ready(function() {
    // request permission to display notifications 
    $("#permission_request").click(function() {
        DesktopNotifications.requestPermission();
    });

            // craete notification   
    $("#create_notification").ready(function() {
        if (!DesktopNotifications.doNotify("https://twimg0-   a.akamaihd.net/profile_images/2647445933/2c75afbe419bc7aaae71f01b29062b84_normal.jpeg", 
                                           "Desktop Notification Example", 
                                           "This is description of out Hello World notification example.")) {
            alert('Unable to fire notifications. Click "Request Permission" button to allow jaspreetchahal.org/examples access to send notifications to your desktop. Please note that this is just a demo and you can block this access anytime later');
        }
    });
});
  </script>

and

<a href="#requestnotifications" id="permission_request">Request permission</a>
<a href="#createnotification" id="create_notification">Send</a>

and work fine to me

Jquery get Desktop Notification when page loaded

1 Answers1