Skip to content
Find file
Fetching contributors…
Cannot retrieve contributors at this time
executable file 75 lines (67 sloc) 3 KB
<!DOCTYPE html>
<title>slideControl.js jQuery Plugin</title>
<link rel="stylesheet" type="text/css" href="slideControl.css" />
<script type="text/javascript" src=""></script>
<script type="text/javascript" src="jquery.slideControl.js"></script>
<script type="text/javascript">
$(document).ready(function() {
<link rel="stylesheet" type="text/css" href="extra/style.css" />
<script type="text/javascript" src="extra/prettify.js"></script>
<div class="content">
<h1>slideControl.js jQuery Plugin <sup>1.0</sup></h1>
<h3><a href="">Nik Korablin</a></h3>
<div class="content">
<ul class="clearfix">
<li><label>Foo: </label><input type="text" value="6.0" class="slideControl" maxlength="3" /></li>
<li><label>Bar: </label><input type="text" value="4.0" class="slideControl" maxlength="3" /></li>
<li><label>FooBar: </label><input type="text" value="9.0" class="slideControl" maxlength="3" /></li>
<div class="content">
<h2>The Code</h2>
<h3>In Your &lt;head&gt;</h3>
<pre class="prettyprint">
&lt;link rel="stylesheet" type="text/css" href="slideControl.css" /&gt;
&lt;script type="text/javascript" src=""&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="jquery.slideControl.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
$(document).ready(function() {
<ul class="options">
<li>speed: Controls the speed of the animation for a slider reszing, defaults to 400</li>
<li>lowerBound: Sets the minimum amount the slider can be set to, defaults to 1</li>
<li>upperBound: Sets the maximum amount the slider can be set to, defaults to 10</li>
<pre class="prettyprint">
&lt;li&gt;&lt;label&gt;Responsiveness: &lt;/label&gt;&lt;input type="text" value="6.0" class="slideControl" /&gt;&lt;/li&gt;
&lt;li&gt;&lt;label&gt;Safety: &lt;/label&gt;&lt;input type="text" value="4.0" class="slideControl" /&gt;&lt;/li&gt;
&lt;li&gt;&lt;label&gt;Information: &lt;/label&gt;&lt;input type="text" value="9.0" class="slideControl" /&gt;&lt;/li&gt;
<p>The CSS file included should be pretty straight-forward. You can change the look of your slide controllers in there from background color to size to how the handle looks. Just take a look around and it should be pretty easy to make changes.</p>
<div class="content">
<p>You are free to use the slideControl.js plugin however you want. Credit is nice, but not required</p>
<ul class="options">
<li><a href="">Download</a></li>
<li><a href="">Github</a></li>
<li><a href="">Portfolio</a></li>
Something went wrong with that request. Please try again.