HTML | Browser Notifications

Author - Ashish

Below is the sample code to get permission of user to display browser notifications in case he approves. Save the following code in simple HTML file:

<script>
document.addEventListener('DOMContentLoaded', function ()
{
	if (Notification.permission !== "granted")
	{
		Notification.requestPermission();
	}
});

function notifyBrowser(title,desc)
{
	if (Notification.permission !== "granted")
	{
		Notification.requestPermission();
	}
	else
	{
		var notification = new Notification(title, 
               {
		//icon:'icon address',
		body: desc
		});
		/* Remove the notification from Notification Center when clicked.*/
		notification.onclick = function () 
                {
		 window.open('http://www.google.com');
    	         notification.close();
		};
		/* Callback function when the notification is closed. */
		notification.onclose = function () {
		//alert('Notification closed');
		};
	}
}
</script>
<body onload = "setTimeout(notifyBrowser('New Notification','Hello Dear! How Are You?'),1000)">
Notification testing
</body>

We can call notifyBrowser() function on any event when we want our notification to show.

Webner Solutions is a Software Development company focused on developing CRM apps (Salesforce, Zoho), LMS Apps (Moodle/Totara), Websites and Mobile apps. If you need Web development or any other software development assistance please contact us at webdevelopment@webners.com

Webner Solutions is a Software Development company focused on developing Insurance Agency Management Systems, Learning Management Systems and Salesforce apps. Contact us at dev@webners.com for your Insurance, eLearning and Salesforce applications.

Leave a Reply

Your email address will not be published. Required fields are marked *

Send your message