-
Book Overview & Buying
-
Table Of Contents
-
Feedback & Rating
HTML5 Data and Services Cookbook
Web notifications are one of the newer features added into modern browsers. They are intended as alerts for the user outside of the web page context. The idea is for them to be browsers intended, for example, when using a mobile browser notification could go into the home screen of the device. On the desktop usually they show up on the right-corner of the screen, at least on most desktop environments.

For the purpose of this example, we will be using data derived from Project Gutenberg http://www.gutenberg.org/. The data are the tips from the chapter Use of spies from Sun Tzu's -Art of war and can be found in this recipe code example under data.json.
To create this recipe we will create an HTML file, and use jQuery for simplicity.
First, we can start with the HTML part, where we just create a simple button and a div element with the ID fallback that we are going to use, if the browser does not support notifications.
<body>
...
Change the font size
Change margin width
Change background colour