forked from sergeylukin/css-3d-bar-graph
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
42 lines (32 loc) · 2.02 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!DOCTYPE html>
<head>
<title>Pure CSS 3D Bar Graph</title>
<link href="style.css" rel="stylesheet" />
</head>
<body>
<h1>Pure CSS 3D Bar Graph</h1>
<p>Choose action:</p>
<input type="radio" name="fill" id="full" /><label for="full">Fill Full</label>
<input type="radio" name="fill" id="f75" /><label for="f75">Fill 75%</label>
<input type="radio" name="fill" id="f50" checked="checked" /><label for="f50">Fill 50%</label>
<input type="radio" name="fill" id="f25" /><label for="f25">Fill 25%</label>
<input type="radio" name="fill" id="empty" /><label for="empty">Empty</label>
<div id="graphcontainer">
<div id="graphbackground"></div>
<div id="graphbar"></div>
<div id="graphforeground">
<div id="p25" class="label">25%</div>
<div id="p50" class="label">50%</div>
<div id="p75" class="label">75%</div>
</div>
</div>
<a href="https://twitter.com/share" class="twitter-share-button" data-via="sergey_lukin" data-hashtags="css">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<!-- GitHub fork ribbon -->
<a href="https://github.com/sergeylukin/css-3d-bar-graph" id="github"><img style="position: absolute; top: 0; right: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub" /></a>
<!-- Resize img -->
<img src="img/resize.png" alt="Resize me!" id="resize" />
<!-- Analytics -->
<script type="text/javascript">var _gaq = _gaq || [];_gaq.push(['_setAccount', 'UA-31126253-1']);_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>
</body>
</html>