Alert users when they have lost internet connectivity with Offline.js

on others

To alert users when they’ve lost internet connectivity, we can use a really tiny library (only 3kb) called Offline.js.

So, what is Offline.js?

Offline.js is a library to automatically alert your users when they’ve lost internet connectivity, like Gmail.

It captures AJAX requests which were made while the connection was down, and remakes them when it’s back up, so your app reacts perfectly.

It is really straightforward to add implement this on our web applications.

  1. Download Offline.js

  2. Download a theme. For that, choose yours here.

  3. Add the JS and CSS files to your pages.

  4. Add a div to be used to display the notification (see full code for an example)

Live Demo

Ahh, and if you want to allow users to play Snake while they don’t have connection, just change the option “game” to true 🙂

Full code: