Check for Internet connectivity in your web app

failsafeIn this tutorial, I will show you how to detect user’s connection status and show message if the connection is lost. Let’s see how we going to do this using jQuery.


Here are the important links. Demo or Download


For this tutorial, I will be using failsafe jQuery plugin by Ram Swaroop. This awesome plugin makes our task a breeze. To check for connectivity using this plugin is as easy as pasting the below jQuery code in your document.

$(function() {
		checkUrl: 'check.php',
		checkInterval: 3000,
		disableElements: '.btn'

I have activated the plugin with three options (only the first option is mandatory). In the first option, we specify a file on the server for the plugin to ping so as to check for connectivity. If the file is not accessible, that means the connectivity is lost. The checkInterval option is the time interval in milliseconds. After this interval the plugin will check for connectivity by pinging the file on the server. Lastly, With the disableElements option we can disable any element on the page by specifying it using it’s class or id.


You can check for more options offered by the plugin over here. Another awesome feature of this plugin is the ability to check for user’s laptop battery level and indicate if the battery is low. This feature is however working only in Firefox browser.[/sociallocker]


Hope you enjoyed this small piece of code. For getting instant updates via email, join my mailing list and I promise you won’t be spammed.

Leave a Comment.