upvote
Version:
Generate a voting widget like the one used on Stack Exchange sites.
124 lines (119 loc) • 4.32 kB
HTML
<head>
<meta charset="utf-8">
<title>jQuery Upvote Test</title>
<script src="../js/jquery-3.1.0.min.js"></script>
<script src="../lib/jquery.upvote.js"></script>
<script src="qunit-1.11.0.js"></script>
<script src="test1.js"></script>
<link rel="stylesheet" href="qunit-1.11.0.css">
<link rel="stylesheet" href="../lib/jquery.upvote.css">
<style type="text/css">
<!--
.hidden {
display: none;
}
div.upvote {
float: left;
}
-->
</style>
</head>
<body>
<h1 id="qunit-header">jQuery Upvote Test</h1>
<h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<div id="demo" style="overflow: auto">
<div id="demo1" class="upvote">
<a class="upvote"></a>
<span class="count"></span>
<a class="downvote"></a>
<a class="star"></a>
</div>
<div id="demo2" class="upvote">
<a class="upvote"></a>
<span class="count"></span>
<a class="downvote"></a>
<a class="star"></a>
</div>
<div id="demo3" class="upvote">
<a class="upvote"></a>
<span class="count"></span>
<a class="downvote"></a>
<a class="star"></a>
</div>
<div id="count-1-upvoted" class="upvote upvote-unix">
<a class="upvote upvote-on"></a>
<span class="count">1</span>
<a class="downvote"></a>
<a class="star"></a>
</div>
<div id="count-2-downvoted" class="upvote upvote-unix">
<a class="upvote"></a>
<span class="count">2</span>
<a class="downvote downvote-on"></a>
<a class="star"></a>
</div>
<div id="count-3-starred" class="upvote upvote-unix">
<a class="upvote"></a>
<span class="count">3</span>
<a class="downvote"></a>
<a class="star star-on"></a>
</div>
<div id="upvoted-downvoted" class="upvote upvote-unix">
<a class="upvote upvote-on"></a>
<span class="count">4</span>
<a class="downvote downvote-on"></a>
<a class="star"></a>
</div>
<div id="count-1-upvoted" class="upvote upvote-meta-stackoverflow">
<a class="upvote upvote-on"></a>
<span class="count">1</span>
<a class="downvote"></a>
<a class="star"></a>
</div>
<div id="count-2-downvoted" class="upvote upvote-meta-stackoverflow">
<a class="upvote"></a>
<span class="count">2</span>
<a class="downvote downvote-on"></a>
<a class="star"></a>
</div>
<div id="count-3-starred" class="upvote upvote-meta-stackoverflow">
<a class="upvote"></a>
<span class="count">3</span>
<a class="downvote"></a>
<a class="star star-on"></a>
</div>
<div id="count-1-upvoted" class="upvote upvote-superuser">
<a class="upvote upvote-on"></a>
<span class="count">1</span>
<a class="downvote"></a>
<a class="star"></a>
</div>
<div id="count-2-downvoted" class="upvote upvote-superuser">
<a class="upvote"></a>
<span class="count">2</span>
<a class="downvote downvote-on"></a>
<a class="star"></a>
</div>
<div id="count-3-starred" class="upvote upvote-superuser">
<a class="upvote"></a>
<span class="count">3</span>
<a class="downvote"></a>
<a class="star star-on"></a>
</div>
</div>
<div id="tests" style="overflow: auto">
</div>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"></div>
<div id="templates" class="hidden">
<div class="upvote">
<a class="upvote" title="This is good stuff. Vote it up! (Click again to undo)"></a>
<span class="count" title="Total number of votes"></span>
<a class="downvote" title="This is not useful. Vote it down. (Click again to undo)"></a>
<a class="star" title="Mark as favorite. (Click again to undo)"></a>
</div>
</div>
</body>
</html>