| 693 |
steven |
1 |
<!DOCTYPE html>
|
|
|
2 |
<html lang='en'>
|
|
|
3 |
<head>
|
|
|
4 |
<meta charset='utf-8'>
|
|
|
5 |
<title>NProgress: slim progress bars in JavaScript</title>
|
|
|
6 |
<link href='support/style.css' rel='stylesheet' />
|
|
|
7 |
<link href='nprogress.css' rel='stylesheet' />
|
|
|
8 |
|
|
|
9 |
<meta name="viewport" content="width=device-width">
|
|
|
10 |
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,400,700,400italic' rel='stylesheet' type='text/css'>
|
|
|
11 |
|
|
|
12 |
<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
|
|
|
13 |
<script src='nprogress.js'></script>
|
|
|
14 |
|
|
|
15 |
<script>if(location.hostname.match(/ricostacruz\.com$/)){var _gaq=_gaq||[];_gaq.push(["_setAccount","UA-20473929-1"]),_gaq.push(["_trackPageview"]),function(){var a=document.createElement("script");a.type="text/javascript",a.async=!0,a.src=("https:"==document.location.protocol?"https://ssl":"http://www")+".google-analytics.com/ga.js";var b=document.getElementsByTagName("script")[0];b.parentNode.insertBefore(a,b)}()}</script>
|
|
|
16 |
</head>
|
|
|
17 |
|
|
|
18 |
<body style='display: none'>
|
|
|
19 |
<header class='page-header'>
|
|
|
20 |
<span class='nprogress-logo fade out'></span>
|
|
|
21 |
<h1>NProgress<i>.js</i></h1>
|
|
|
22 |
<p class='fade out brief big'>A nanoscopic progress bar. Featuring realistic
|
|
|
23 |
trickle animations to convince your users that something is happening!</p>
|
|
|
24 |
</header>
|
|
|
25 |
|
|
|
26 |
<div class='contents fade out'>
|
|
|
27 |
<div class='controls'>
|
|
|
28 |
<p>
|
|
|
29 |
<button class='button play' id='b-0'></button>
|
|
|
30 |
<i>NProgress</i><b>.start()</b>
|
|
|
31 |
—
|
|
|
32 |
shows the progress bar
|
|
|
33 |
</p>
|
|
|
34 |
<p>
|
|
|
35 |
<button class='button play' id='b-40'></button>
|
|
|
36 |
<i>NProgress</i><b>.set(0.4)</b>
|
|
|
37 |
—
|
|
|
38 |
sets a percentage
|
|
|
39 |
</p>
|
|
|
40 |
<p>
|
|
|
41 |
<button class='button play' id='b-inc'></button>
|
|
|
42 |
<i>NProgress</i><b>.inc()</b>
|
|
|
43 |
—
|
|
|
44 |
increments by a little
|
|
|
45 |
</p>
|
|
|
46 |
<p>
|
|
|
47 |
<button class='button play' id='b-100'></button>
|
|
|
48 |
<i>NProgress</i><b>.done()</b>
|
|
|
49 |
—
|
|
|
50 |
completes the progress
|
|
|
51 |
</p>
|
|
|
52 |
</div>
|
|
|
53 |
<div class='actions'>
|
|
|
54 |
<a href='https://github.com/rstacruz/nprogress' class='button primary big'>
|
|
|
55 |
Download
|
|
|
56 |
v<span class='version'></span>
|
|
|
57 |
</a>
|
|
|
58 |
<p class='brief'>Perfect for Turbolinks, Pjax, and other Ajax-heavy apps.</p>
|
|
|
59 |
</div>
|
|
|
60 |
<div class='hr-rule'></div>
|
|
|
61 |
<div class='share-buttons'>
|
|
|
62 |
<iframe src="http://ghbtns.com/github-btn.html?user=rstacruz&repo=nprogress&type=watch&count=true"
|
|
|
63 |
allowtransparency="true" frameborder="0" scrolling="0" width="100" height="20"></iframe>
|
|
|
64 |
<iframe src="http://ghbtns.com/github-btn.html?user=rstacruz&type=follow&count=true"
|
|
|
65 |
allowtransparency="true" frameborder="0" scrolling="0" width="175" height="20"></iframe>
|
|
|
66 |
<a href="https://news.ycombinator.com/submit" class="hn-button" data-title="NProgress" data-url="http://ricostacruz.com/nprogress/" data-count="horizontal" data-style="twitter">HN</a>
|
|
|
67 |
</div>
|
|
|
68 |
</div>
|
|
|
69 |
|
|
|
70 |
<script>
|
|
|
71 |
$('body').show();
|
|
|
72 |
$('.version').text(NProgress.version);
|
|
|
73 |
NProgress.start();;
|
|
|
74 |
setTimeout(function() { NProgress.done(); $('.fade').removeClass('out'); }, 1000);
|
|
|
75 |
|
|
|
76 |
$("#b-0").click(function() { NProgress.start();; });
|
|
|
77 |
$("#b-40").click(function() { NProgress.set(0.4); });
|
|
|
78 |
$("#b-inc").click(function() { NProgress.inc(); });
|
|
|
79 |
$("#b-100").click(function() { NProgress.done(); });
|
|
|
80 |
</script>
|
|
|
81 |
|
|
|
82 |
<script>var HN=[];HN.factory=function(e){return function(){HN.push([e].concat(Array.prototype.slice.call(arguments,0)))};},HN.on=HN.factory("on"),HN.once=HN.factory("once"),HN.off=HN.factory("off"),HN.emit=HN.factory("emit"),HN.load=function(){var e="hn-button.js";if(document.getElementById(e))return;var t=document.createElement("script");t.id=e,t.src="//hn-button.herokuapp.com/hn-button.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n)},HN.load();</script>
|
|
|
83 |
</body>
|
|
|
84 |
</html>
|