Demo

  • slider ends

jFormslider v1.0.8

jFormslider v1.0.8 is a jquery pluggin where we can convert a big form in to a slider
Form should be in ul li format
<div id="slider">
	<ul>
		<li>--form componants--</li>
		<li>--form componants--</li>
		<li>--form componants--</li>
	</ul>
</div>

Usage

//default options
options={
	width:600,//width of slider
	height:300,//height of slider
	next_prev:true,//will show next and prev links
	next_class:'',//class for next link
	prev_class:'',//class for prev link
	error_class:'',//class for validation errors
	texts:{
			next:'next',//verbiage for next link
			prev:'prev'//verbiage for prev link
		  },
	speed:400,//slider speed
		}	
$('#slider').jFormslider(options);//usage

Other features

Little validations

if you want to validate a input or select element put attribute 'required' and to overide default message put attributr 'data-msg'
ex:<input type="text" name="username" required data-msg="Please enter username"/>
if you want to validate email put attribute 'email'
ex:<input type="text" name="email" required data-msg="Please enter a valid email "/>

Call before

Before sliding to next slide you can call a function For this just put attribute
call-before="some_function()" 
in li Before loading this li it will call this function function should return true if you want to slide to this li function should return false if you dont want to slide to this li

Goto slide

If you want to goto particular li without clicking through all slides you can call
$('#slider').gotoSlide(data-id)
you should specify a attribute in li called 'data-id' for this
<li data-id="middle_page"></li>
$('#slider').gotoSlide('middle_page')
For more options and docs visit jformslider.com please report bugs to bugs@jformslider.com