<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>jQuery backDetect - Back button click detection</title>
<link rel="stylesheet" href="stylesheets/styles.css">
<link rel="stylesheet" href="stylesheets/github-light.css">
<meta name="viewport" content="width=device-width">
<meta name="description" content="backDetect is a jQuery plugin that fires a callback function when a user hits the browser's back button." />
<meta name="keywords" content="jquery backDetect, backDetect, back detect, jquery, javascript, back button, Ian Rogren, ianrogren" />
<meta name="robots" content="index, follow" />
<script src="javascripts/scale.fix.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript" src="jquery.backDetect.js"></script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script>
$(window).load(function(){
$('body').backDetect(function(){
alert("Look forward to the future, not the past!");
});
});
</script>
</head>
<body>
<div class="wrapper">
<header>
<h1>backDetect</h1>
<p>Determining when a user clicks their browser's back button has never been easier with this jQuery plugin. With a quick easy install and minimal set up work you'll be firing callback functions on back button declarations in no time.</p>
<p class="view"><a href="https://github.com/ianrogren/jquery-backDetect">View the Project on GitHub <small>ianrogren/jquery-backDetect</small></a></p>
<ul>
<li><a href="https://github.com/ianrogren/jquery-backDetect/zipball/master">Download <strong>ZIP File</strong></a></li>
<li><a href="https://github.com/ianrogren/jquery-backDetect/tarball/master">Download <strong>TAR Ball</strong></a></li>
<li><a href="https://github.com/ianrogren/jquery-backDetect">View On <strong>GitHub</strong></a></li>
</ul>
</header>
<section>
<h3>
<a id="welcome-to-github-pages" class="anchor" href="#welcome-to-github-pages" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Using jQuery-backDetect
</h3>
<p>Can append to any element or class:</p>
<div class="highlight highlight-source-js"><pre> <span class="pl-en">$</span>(<span class="pl-c1">window</span>).<span class="pl-c1">load</span>(<span class="pl-k">function</span>(){
<span class="pl-en">$</span>(<span class="pl-s"><span class="pl-pds">'</span>body<span class="pl-pds">'</span></span>).<span class="pl-en">backDetect</span>(<span class="pl-k">function</span>(){
<span class="pl-c"><span class="pl-c">//</span> Callback function</span>
<span class="pl-en">alert</span>(<span class="pl-s"><span class="pl-pds">"</span>Look forward to the future, not the past!<span class="pl-pds">"</span></span>);
});
});<span class="pl-k"><</span><span class="pl-k">/</span>script<span class="pl-k">></span></pre></div>
<p>Click the back button to test.</p>
</section>
</div>
</body>
</html>