Nerve Slider 6.1

Download .zip Free

1 Include the jQuery library

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>

2 Include the Nerve Slider jQuery & CSS:

<script type="text/javascript" src="http://code.ryanbruzan.net/nerveSlider/jquery.nerveSlider.min.js"></script>
<link type="text/css" href="http://code.ryanbruzan.net/nerveSlider/style.css">

Hint: Can't host the files yourself? Use the code above to link directly to them.

3 Make a div with any class or ID and throw in your img's. Attributes you can add to your img's can be viewed in the table below.

Apply any of the following attributes to any of your img elements.

<div class="iAmTest">
	<img src="test.jpg">
	<img src="test2.png">
	<img src="test3.gif">
	<!-- etc... -->
</div>

<div class="iAmTest">
	<div>
		<img src="test.jpg">
		<div class="content">
			Anything can go here!  You're in control!
		</div>
	</div>
	<img src="test2.png">
	<img src="test3.gif">
	<!-- etc... -->
</div>

4 Set up Nerve Slider to your liking, using the div's class or ID you used in Step 3. There are several settings that come with Nerve Slider.

<script>
$(document).ready(function(){
	$(".iAmTest").startslider({
		// options...
		});
});
</script>

Controlling Nerve Slider - The API