In this series we have been building the elements of a user note-keeping utility for Web pages, using the IndexedDB API. So far we have built the database, created an object store to save the user's notes and handled adding and deleting notes. In this last part of the series we will bring these elements together by querying the note database, presenting the user notes within the page markup so that they can see them on returning to the page. This is the final part in a series of four tutorials: Setup and opening...

In this series on creating a user note-keeping utility, we are using IndexedDB to store user notes on a Web page. In the first two parts of the series we created the IndexedDB database and object store, as well as the initial visible HTML elements in the Web page. In this part we will implement allowing the user to add and delete notes to and from the data store. In the final part of the series we will query the notes and display them within the page. This is part 3 in a series of 4: Setup and opening the note database...

In this series we are using the IndexedDB API to create a basic note-keeping utility within a Web page. In the first part of the series we setup the HTML5 page elements and started IndexedDB processing by attempting to open the database. In this part we will be working on creating the object store, which is how we define the structure of the note database. In the final two parts of the series we will handle inserting, deleting and querying notes. This is part 2 in a series of 4 tutorials: Setup and opening the...

Indexed Database (IndexedDB) is an API for storing data at client side and a proposed standard, still in the relatively early stages of development. With the IndexedDB API, developers can store data objects within the user's browser. In this tutorial series we will explore the basics of this emerging technology by building a simple note-keeping facility for a Web page or site. Users will be able to add and delete notes, with past notes automatically displaying when the user revisits. The notes are...

The scrolldeck.js library is probably one of the best ways out there to implement a scrolling presentation deck. All you have to do is build a web page with each slide as a div. It requires JQuery, Scrollorama, scrollTo, easing & scrolldeck  JS scripts to function. After linking all of the above scripts, create the slide deck on the document ready event and configure the settings as shown: $(document).ready(function() { var deck = new $.scrolldeck({ buttons: '.nav-button', slides: '.slide',...

In the rapidly evolving arena of browser standards, among the newest additions is a tag that significantly facilitates the transfer and sharing of data between online applications and services. The Google-originated ‘Web Intents’ API gives a user the ability to select an application to perform a specific action on a designated piece of data, such as an image, audio or video file, or text file. Here’s how the feature works: Say, for instance, a person wants to edit or share a photo that has been...

HTML5 offers a range of improved options for executing JavaScript functions. With Web Workers, you can execute scripts in the background, so that intensive processing need not interfere with the main functionality of your page. Of course this is most useful for complex tasks, but in this tutorial we will demonstrate the basics of using Web Workers with your pages using a simple example. At the moment the most recent versions of all major browsers, except Internet Explorer, support Web Workers - you...