spacerjs
Version:
Manipulate the DOM easily
5,151 lines (1,078 loc) • 83.6 kB
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: Namespace: _</title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>
<div id="main">
<h1 class="page-title">Namespace: _</h1>
<section>
<header>
<h2><span class="attribs"><span class="type-signature"></span></span>_<span class="signature">(selector, create<span class="signature-attributes">opt</span>, contents<span class="signature-attributes">opt</span>, strict<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h2>
</header>
<article>
<div class="container-overview">
<div class="description">
SpacerJS, finds/creates an element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>selector</code></td>
<td class="type">
<span class="param-type">string</span>
|
<span class="param-type">HTMLElement</span>
</td>
<td class="attributes">
</td>
<td class="description last">A valid selector</td>
</tr>
<tr>
<td class="name"><code>create</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Boolean to create an element or not</td>
</tr>
<tr>
<td class="name"><code>contents</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Contents to find element by</td>
</tr>
<tr>
<td class="name"><code>strict</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">If true, the contents must match the text exactly</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-license">License:</dt>
<dd class="tag-license"><ul class="dummy"><li>MIT</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line44">line 44</a>
</li></ul></dd>
</dl>
</div>
<h3 class="subsection-title">Members</h3>
<h4 class="name" id="~element"><span class="type-signature">(inner) </span>element<span class="type-signature"></span></h4>
<div class="description">
The selected HTMLElement
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line48">line 48</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~fn"><span class="type-signature">(inner) </span>fn<span class="type-signature"></span></h4>
<div class="description">
Object of any custom methods you want to add
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line71">line 71</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~meta"><span class="type-signature">(inner) </span>meta<span class="type-signature"></span></h4>
<div class="description">
Meta data object
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line56">line 56</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~nodelist"><span class="type-signature">(inner) </span>nodelist<span class="type-signature"></span></h4>
<div class="description">
The selected nodelist
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line52">line 52</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~state"><span class="type-signature">(inner) </span>state<span class="type-signature"></span></h4>
<div class="description">
Object that keeps track of element's meta state
</div>
<h5 class="subsection-title">Properties:</h5>
<table class="props">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>hidden</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="description last">Tracks if element is hidden by hide() or show() meta functions</td>
</tr>
<tr>
<td class="name"><code>hovered</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="description last">Tracks if element is hovered by hover() or unhover() meta functions</td>
</tr>
<tr>
<td class="name"><code>active</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="description last">Tracks if element is active by active() or unactive() meta functions</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line63">line 63</a>
</li></ul></dd>
</dl>
<h3 class="subsection-title">Methods</h3>
<h4 class="name" id="~__"><span class="type-signature">(inner) </span>__<span class="signature">(selector)</span><span class="type-signature"></span></h4>
<div class="description">
Selects and returns a NodeList
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>selector</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">QuerySelectorAll string</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line167">line 167</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~active"><span class="type-signature">(inner) </span>active<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Adds the activeClass that was set with setMeta(metaObj)
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line514">line 514</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~addClass"><span class="type-signature">(inner) </span>addClass<span class="signature">(className)</span><span class="type-signature"></span></h4>
<div class="description">
Adds a class to the element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>className</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">Class Name</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line444">line 444</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~animate"><span class="type-signature">(inner) </span>animate<span class="signature">(cssProperty, value, time)</span><span class="type-signature"></span></h4>
<div class="description">
Animates the element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>cssProperty</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">cssProperty to edit</td>
</tr>
<tr>
<td class="name"><code>value</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">New value of cssProperty</td>
</tr>
<tr>
<td class="name"><code>time</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">Css Transition length, ex: "1s"</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line686">line 686</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~append"><span class="type-signature">(inner) </span>append<span class="signature">(elem)</span><span class="type-signature"></span></h4>
<div class="description">
Appends the a Node or string to a parent element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>elem</code></td>
<td class="type">
<span class="param-type">HTMLElement</span>
|
<span class="param-type">Node</span>
|
<span class="param-type">String</span>
</td>
<td class="description last">Selector string or HTMLElement</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line192">line 192</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~appendChild"><span class="type-signature">(inner) </span>appendChild<span class="signature">(child)</span><span class="type-signature"></span></h4>
<div class="description">
Appends a child element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>child</code></td>
<td class="type">
<span class="param-type">HTMLElement</span>
</td>
<td class="description last">An HTMLElement</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line200">line 200</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~appendList"><span class="type-signature">(inner) </span>appendList<span class="signature">(elementlist)</span><span class="type-signature"></span></h4>
<div class="description">
Appends a list of HTML Elements
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>elementlist</code></td>
<td class="type">
<span class="param-type">Array.<HTMLElement></span>
</td>
<td class="description last">Array of Elements or nodes</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line208">line 208</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~appendTo"><span class="type-signature">(inner) </span>appendTo<span class="signature">(parent)</span><span class="type-signature"></span></h4>
<div class="description">
Appends the child element to a parent element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>parent</code></td>
<td class="type">
<span class="param-type">string</span>
|
<span class="param-type">HTMLElement</span>
</td>
<td class="description last">Selector string</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line176">line 176</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~at"><span class="type-signature">(inner) </span>at<span class="signature">(index)</span><span class="type-signature"></span></h4>
<div class="description">
Selects an element, not 0 based
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>index</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="description last">Index</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line595">line 595</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
Element | undefined
</div>
<h5>Example</h5>
<pre class="prettyprint"><code>let myElement = _('div').at(5) // gets the fifth child and not the 4th like an array</code></pre>
<h4 class="name" id="~attr"><span class="type-signature">(inner) </span>attr<span class="signature">(attribute, value)</span><span class="type-signature"></span></h4>
<div class="description">
Sets/Creates a attribute to a value
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>attribute</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">Attribute to set/create</td>
</tr>
<tr>
<td class="name"><code>value</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">Value that the Attribute will be set to</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line351">line 351</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~children"><span class="type-signature">(inner) </span>children<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Returns NodeList<ChildNode>
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line460">line 460</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
NodeList
</div>
<h4 class="name" id="~click"><span class="type-signature">(inner) </span>click<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Clicks the element
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line267">line 267</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~clone"><span class="type-signature">(inner) </span>clone<span class="signature">(keepChildren<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
<div class="description">
Clones the element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>keepChildren</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">Keep child elements</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line332">line 332</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
Cloned Node
</div>
<h4 class="name" id="~compareNode"><span class="type-signature">(inner) </span>compareNode<span class="signature">(node)</span><span class="type-signature"></span></h4>
<div class="description">
Compares two nodes to see if they are similar
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>node</code></td>
<td class="type">
<span class="param-type">HTMLElement</span>
|
<span class="param-type">Node</span>
</td>
<td class="description last">HTMLElement or Node</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line369">line 369</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
Boolean
</div>
<h4 class="name" id="~contains"><span class="type-signature">(inner) </span>contains<span class="signature">(node)</span><span class="type-signature"></span></h4>
<div class="description">
Checks if the element contains a Node
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>node</code></td>
<td class="type">
<span class="param-type">Node</span>
</td>
<td class="description last">HTML Node to check for</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line324">line 324</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
Boolean
</div>
<h4 class="name" id="~css"><span class="type-signature">(inner) </span>css<span class="signature">(pseudoElement<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
<div class="description">
Retuns computedStyle of element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>pseudoElement</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="description last">A pseudoElement</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line532">line 532</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
CSSStyleDeclaration | null
</div>
<h4 class="name" id="~dbclick"><span class="type-signature">(inner) </span>dbclick<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Clicks the element twice
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line274">line 274</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~debug"><span class="type-signature">(inner) </span>debug<span class="signature">(…args)</span><span class="type-signature"></span></h4>
<div class="description">
Console logs any arguments
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>args</code></td>
<td class="type">
<span class="param-type">any</span>
</td>
<td class="attributes">
<repeatable><br>
</td>
<td class="description last">Any arguments</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line491">line 491</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~deleteMeta"><span class="type-signature">(inner) </span>deleteMeta<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Removes metadata
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line735">line 735</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~each"><span class="type-signature">(inner) </span>each<span class="signature">(cb)</span><span class="type-signature"></span></h4>
<div class="description">
Iterate through a nodelist
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>cb</code></td>
<td class="type">
<span class="param-type">function</span>
</td>
<td class="description last">Callback with first parameter being value and last being index</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line604">line 604</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~empty"><span class="type-signature">(inner) </span>empty<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Removes all empty child nodes
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line544">line 544</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~fadeIn"><span class="type-signature">(inner) </span>fadeIn<span class="signature">(intensity<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
<div class="description">
Fades in the selected element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>intensity</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
0.05
</td>
<td class="description last">Intensity of the fade</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line660">line 660</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~fadeOut"><span class="type-signature">(inner) </span>fadeOut<span class="signature">(intensity<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
<div class="description">
Fades out the selected element
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>intensity</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
0.05
</td>
<td class="description last">Intensity of the fade</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line636">line 636</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~first"><span class="type-signature">(inner) </span>first<span class="signature">(node<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
<div class="description">
Returns the first child element as an HTMLelement
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>node</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
false
</td>
<td class="description last">Determines the returned value as a HTMLElement or Node</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line578">line 578</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
HTMLElement
</div>
<h4 class="name" id="~focus"><span class="type-signature">(inner) </span>focus<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Focuses the element
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line282">line 282</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~hasAttr"><span class="type-signature">(inner) </span>hasAttr<span class="signature">(attribute)</span><span class="type-signature"></span></h4>
<div class="description">
Checks if the element has an certain attribute
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>attribute</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">Attribute</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line343">line 343</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
Boolean
</div>
<h4 class="name" id="~hasChildren"><span class="type-signature">(inner) </span>hasChildren<span class="signature">(normalize)</span><span class="type-signature"></span></h4>
<div class="description">
Checks if an element has any child nodes
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>normalize</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="description last">Boolean to normalize before checking for child nodes</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line360">line 360</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
Boolean
</div>
<h4 class="name" id="~hide"><span class="type-signature">(inner) </span>hide<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Adds the hidden class that was set with setMeta()
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line418">line 418</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~hover"><span class="type-signature">(inner) </span>hover<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Adds the hoverClass that was set with setMeta(metaObj)
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line498">line 498</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~html"><span class="type-signature">(inner) </span>html<span class="signature">(str)</span><span class="type-signature"></span></h4>
<div class="description">
Appends the a string to the selected element innerHTML
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>str</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">String to be inserted in the innerHTML</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line252">line 252</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~keydown"><span class="type-signature">(inner) </span>keydown<span class="signature">(cb)</span><span class="type-signature"></span></h4>
<div class="description">
Listens for the keydown event
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>cb</code></td>
<td class="type">
<span class="param-type">function</span>
</td>
<td class="description last">Callback</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line475">line 475</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~keyup"><span class="type-signature">(inner) </span>keyup<span class="signature">(cb)</span><span class="type-signature"></span></h4>
<div class="description">
Listens for the keyup event
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>cb</code></td>
<td class="type">
<span class="param-type">function</span>
</td>
<td class="description last">Callback</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line483">line 483</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~kill"><span class="type-signature">(inner) </span>kill<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Removes the element
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line763">line 763</a>
</li></ul></dd>
</dl>
<h4 class="name" id="~last"><span class="type-signature">(inner) </span>last<span class="signature">(node<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
<div class="description">
Returns the last child element as an HTMLelement
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>node</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
false
</td>
<td class="description last">Determines the returned value as a HTMLElement or Node</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Spacer.js.html">Spacer.js</a>, <a href="Spacer.js.html#line586">line 586</a>