demo.html

<!DOCTYPE html>
<html lang="en" class="no-js">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> 
		<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
		<title>FailSafe (Demo) - A jQuery Plugin to make your App Robust</title>
		<meta name="description" content="A jQuery Plugin to make your App Robust. Protects your App from Lost Internet Connectivity & Low Battery Level"/>
		<meta name="keywords" content="failsafe,failsafe.js,check net,internet connection examiner,check battery,battery api"/>
		<meta name="author" content="Ram Swaroop"/>
		<link rel="stylesheet" type="text/css" href="demo-style.css" />
                <link rel="stylesheet" type="text/css" href="failsafe.css" />
                <script src="jquery-1.8.3.min.js"></script>
                <script src="failsafe.js?v=1.0.2"></script>
                <script type="text/javascript">

                    var _gaq = _gaq || [];
                    _gaq.push(['_setAccount', 'UA-31158320-1']);
                    _gaq.push(['_setDomainName', 'compzets.com']);
                    _gaq.push(['_trackPageview']);

                    (function() {
                        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
                        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
                        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
                    })();

                </script>
	</head>
	<body>
                
            <div class="header-container">
                <header>
                    <h1>FailSafe Demo<span>A jQuery Plugin to make your App Robust</span></h1>	
                </header>
            </div>
            <div class="container">
                <div class="row">
                    <div class="span12">
                    <h3>.:.: How this plugin gonna help you?</h3>
                    <p>
                        <strong>FailSafe</strong> is a jQuery plugin to help your application work correct even in peril situations.
                        In other words, it takes care of situations like <strong>Lost Internet Connectivity</strong> and <strong>Low Battery Level</strong>.
                        When a user loses Internet Connectivity or his laptop's Charge goes down, this plugin shows a very user-friendly message to the user.
                        Optionally, this plugin can also disable some of the elements in the page which may require proper Internet Connectivity or Higher Battery Level to function properly. 
                    </p>
                    <p class='ac'>
                        <strong>NOTE:</strong> You have to run this Demo on a server for this plugin to work
                    </p>
                    </div>
                </div>
            </div>
<script>
$(function(){
    $.failsafe({checkUrl:'failsafe.css',checkInterval:5000,chargeThreshold:80});
});
</script>
</body>
</html>