hammerjs
Version:
A javascript library for multi-touch gestures
476 lines (245 loc) • 13.8 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<title>Instance - Hammer.JS</title>
<link rel="stylesheet" href="http://yui.yahooapis.com/3.8.0pr2/build/cssgrids/cssgrids-min.css">
<link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
<link rel="stylesheet" href="../assets/css/main.css" id="site_styles">
<script src="http://yui.yahooapis.com/combo?3.8.0pr2/build/yui/yui-min.js"></script>
</head>
<body class="yui3-skin-sam">
<div id="doc">
<div id="hd" class="yui3-g header">
<div class="yui3-u-3-4">
<h1><a href="../index.html">Hammer.JS: Instance</a></h1>
</div>
<div class="yui3-u-1-4 version">
<em>API Docs for: 1.1.0</em>
</div>
</div>
<div class="yui3-g">
<div id="sidebar" class="yui3-u">
<div id="modules" class="sidebox">
<div class="hd">
<h2 class="no-toc">Modules</h2>
</div>
<div class="bd">
<ul>
<li><a href="../modules/gestures.html">gestures</a>
</li>
<li><a href="../modules/hammer.html">hammer</a>
</li>
</ul>
</div>
</div>
<div id="classes" class="sidebox">
<div class="hd">
<h2 class="no-toc">Classes</h2>
</div>
<div class="bd">
<ul>
<li><a href="../classes/Detection.html">Detection</a></li>
<li><a href="../classes/Drag.html">Drag</a></li>
<li><a href="../classes/Event.html">Event</a></li>
<li><a href="../classes/Gesture.html">Gesture</a></li>
<li><a href="../classes/Hammer.html">Hammer</a></li>
<li><a href="../classes/Hold.html">Hold</a></li>
<li><a href="../classes/Instance.html">Instance</a></li>
<li><a href="../classes/PointerEvent.html">PointerEvent</a></li>
<li><a href="../classes/Release.html">Release</a></li>
<li><a href="../classes/Swipe.html">Swipe</a></li>
<li><a href="../classes/Tap.html">Tap</a></li>
<li><a href="../classes/Touch.html">Touch</a></li>
<li><a href="../classes/Transform.html">Transform</a></li>
<li><a href="../classes/Utils.html">Utils</a></li>
</ul>
</div>
</div>
<div id="methods-on-page" class="sidebox on-page">
<div class="hd">
<h2 class="no-toc">Methods On Page</h2>
</div>
<div class="bd">
<ul>
<li><a href="#methods_dispose">dispose</a></li>
<li><a href="#methods_enable">enable</a></li>
<li><a href="#methods_off">off</a></li>
<li><a href="#methods_on">on</a></li>
<li><a href="#methods_trigger">trigger</a></li>
</ul>
</div>
</div>
<div id="fileTree" class="sidebox">
<div class="hd">
<h2 class="no-toc">Files</h2>
</div>
<div class="bd">
<ul><li>src/<ul><li><a href="../files/src_detection.js.html">detection.js</a></li><li><a href="../files/src_event.js.html">event.js</a></li><li><a href="../files/src_export.js.html">export.js</a></li><li>gestures/<ul><li><a href="../files/src_gestures_drag.js.html">drag.js</a></li><li><a href="../files/src_gestures_gesture.js.html">gesture.js</a></li><li><a href="../files/src_gestures_hold.js.html">hold.js</a></li><li><a href="../files/src_gestures_release.js.html">release.js</a></li><li><a href="../files/src_gestures_swipe.js.html">swipe.js</a></li><li><a href="../files/src_gestures_tap.js.html">tap.js</a></li><li><a href="../files/src_gestures_touch.js.html">touch.js</a></li><li><a href="../files/src_gestures_transform.js.html">transform.js</a></li></ul></li><li><a href="../files/src_instance.js.html">instance.js</a></li><li><a href="../files/src_pointerevent.js.html">pointerevent.js</a></li><li><a href="../files/src_setup.js.html">setup.js</a></li><li><a href="../files/src_utils.js.html">utils.js</a></li></ul></li></ul>
</div>
</div>
</div>
<div id="main" class="yui3-u">
<div class="content"><h4>Class Instance</h4>
<span class="foundat">Class defined in: <a href="../files/src_instance.js.html#l5"><code>src/instance.js:5</code></a></span>
<div class="intro"><p>create new hammer instance
all methods should return the instance itself, so it is chainable.</p>
</div>
<a name="methods_Instance"></a>
<div class="method item">
Hammer.Instance <strong class="name"><code>Instance</code></strong>( <code>element, [options={}] </code> )
<br>
<span class="foundat">
<a href="../files/src_instance.js.html#l5"><code>src/instance.js:5</code></a>
</span><br>
<strong>Parameters:</strong>
<ul class="params">
<li>
<code>element</code> <strong><<a href="https://developer.mozilla.org/en/Document_Object_Model_(DOM)/HTMLElement" class="crosslink external" target="_blank">HTMLElement</a>></strong>
</li>
<li>
<code>[options={}]</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a>></strong>
<p>options are merged with <code>Hammer.defaults</code></p>
</li>
</ul>
<br><div class="returns"><strong>Returns:</strong> <Hammer.Instance> </div>
</div>
<div id="classdocs">
<ul>
<li><a href="#methods">Methods</a></li>
<li><a href="#props">Properties</a></li>
</ul>
<div>
<div id="methods">
<a name="methods_dispose"></a>
<div class="method item">
Null <strong class="name"><code>dispose</code></strong>( <code> </code> )
<br>
<span class="foundat">
<a href="../files/src_instance.js.html#l152"><code>src/instance.js:152</code></a>
</span><br>
<p>dispose this hammer instance</p>
<br><div class="returns"><strong>Returns:</strong> <Null> </div>
</div>
<a name="methods_enable"></a>
<div class="method item">
<code>chainable</code> <strong class="name"><code>enable</code></strong>( <code>state </code> )
<br>
<span class="foundat">
<a href="../files/src_instance.js.html#l140"><code>src/instance.js:140</code></a>
</span><br>
<p>enable of disable hammer.js detection</p>
<strong>Parameters:</strong>
<ul class="params">
<li>
<code>state</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a>></strong>
</li>
</ul>
</div>
<a name="methods_off"></a>
<div class="method item">
<code>chainable</code> <strong class="name"><code>off</code></strong>( <code>gestures, handler </code> )
<br>
<span class="foundat">
<a href="../files/src_instance.js.html#l90"><code>src/instance.js:90</code></a>
</span><br>
<p>unbind events to the instance</p>
<strong>Parameters:</strong>
<ul class="params">
<li>
<code>gestures</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a>></strong>
</li>
<li>
<code>handler</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function" class="crosslink external" target="_blank">Function</a>></strong>
</li>
</ul>
</div>
<a name="methods_on"></a>
<div class="method item">
<code>chainable</code> <strong class="name"><code>on</code></strong>( <code>gestures, handler </code> )
<br>
<span class="foundat">
<a href="../files/src_instance.js.html#l73"><code>src/instance.js:73</code></a>
</span><br>
<p>bind events to the instance</p>
<strong>Parameters:</strong>
<ul class="params">
<li>
<code>gestures</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a>></strong>
<p>multiple gestures by splitting with a space</p>
</li>
<li>
<code>handler</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function" class="crosslink external" target="_blank">Function</a>></strong>
<ul>
<li><code>ev</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a>></strong> <p>event object</p>
</li>
</ul>
</li>
</ul>
</div>
<a name="methods_trigger"></a>
<div class="method item">
<code>chainable</code> <strong class="name"><code>trigger</code></strong>( <code>gesture, [eventData] </code> )
<br>
<span class="foundat">
<a href="../files/src_instance.js.html#l110"><code>src/instance.js:110</code></a>
</span><br>
<p>trigger gesture event</p>
<strong>Parameters:</strong>
<ul class="params">
<li>
<code>gesture</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a>></strong>
</li>
<li>
<code>[eventData]</code> <strong><<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a>></strong>
</li>
</ul>
</div>
</div>
<div id="props">
<a name="props_element"></a>
<div class="props item">
<code>element</code> <<strong><a href="https://developer.mozilla.org/en/Document_Object_Model_(DOM)/HTMLElement" class="crosslink external" target="_blank">HTMLElement</a></strong>>
<br>
<span class="foundat"><a href="../files/src_instance.js.html#l22"><code>src/instance.js:22</code></a></span>
</div>
<a name="props_enabled"></a>
<div class="props item">
<code>enabled</code> <<strong><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></strong>>
<br>
<span class="foundat"><a href="../files/src_instance.js.html#l28"><code>src/instance.js:28</code></a></span>
</div>
<a name="props_eventHandlers"></a>
<div class="props item">
<code>eventHandlers</code> <<strong><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></strong>>
<br>
<span class="foundat"><a href="../files/src_instance.js.html#l63"><code>src/instance.js:63</code></a></span>
<p>keep a list of user event handlers which needs to be removed when calling 'dispose'</p>
</div>
<a name="props_eventStartHandler"></a>
<div class="props item">
<code>eventStartHandler</code> <<strong><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></strong>>
<br>
<span class="foundat"><a href="../files/src_instance.js.html#l49"><code>src/instance.js:49</code></a></span>
<p>event start handler on the element to start the detection</p>
</div>
<a name="props_options"></a>
<div class="props item">
<code>options</code> <<strong><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></strong>>
<br>
<span class="foundat"><a href="../files/src_instance.js.html#l35"><code>src/instance.js:35</code></a></span>
<p>options, merged with the defaults</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="../assets/vendor/prettify/prettify-min.js"></script>
<script>prettyPrint();</script>
<script src="../assets/js/yui-prettify.js"></script>
<script src="../assets/js/tabs.js"></script>
</body>
</html>