Place for some configs

Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores.

Breadcrumb v 1.0

Makes and handles a breadcrumb navigation

Options read more about inline data attributes

optiondefaultpossible valuesdescriptionsinceinfo
start0integer defines the start field id (starting with 0)1.0
numbersfalsetrue | false display numbers before the text1.0
allownextonlyfalsetrue | false only previous fields and the next field is clickable1.0
lockedfalsetrue | false defines if the breadcrumb is locked1.0
connectnullid of the connected DOM element parse the query string from the location and fill the form with the data1.0
onChangefunction(){}function(element,id) callback if the breadcrumb changed. element is the respective jQuery element. id is the id of the field1.0

Methods

method namedefaultargumentsdescriptionsinceinfo
activateelement | id activate the start field id. element can be the id or the jQuery element1.0
locktrueboolean lock or unlock the whole breadcrumb (unlock with lock(false) )1.0
next activates the next field1.0
prev activates the previous field1.0
setkey, value sets the the option 'key' with the value 'value'1.0

Usage

$(selector).wl_Breadcrumb([options]);

Calling Methods

$(selector).wl_Breadcrumb('method', [,arg [,arg]]);

Markup

<ul class="breadcrumb">
	<li><a>Welcome</a></li>
	<li><a>Article</a></li>
	<li><a>Send</a></li>
	<li><a>Payment</a></li>
	<li><a>Confirmation</a></li>
</ul>

Use Icons

<ul class="breadcrumb">
	<li class="i_house"><a>Welcome</a></li>
	<li class="i_book"><a>Article</a></li>
	<li class="i_inbox"><a>Send</a></li>
	<li class="i_money"><a>Payment</a></li>
	<li class="i_information"><a>Confirmation</a></li>
</ul>

Markup of a connected element

<div id="breadcrumbcontent">
	<div>
		<h3>Welcome</h3>
		...
	</div>
	<div>
		<h3>Article</h3>
		...
	</div>
	<div>
		<h3>Send</h3>
		...
	</div>
	<div>
		<h3>Payment</h3>
		...
	</div>
	<div>
		<h3>Confirmation</h3>
		...
	</div>
</div>

Examples