Adds advanced usage docs

This commit is contained in:
Zeno Rocha 2015-09-28 23:52:10 -07:00
parent c989d6a5d4
commit 23504403d1

View File

@ -130,6 +130,26 @@ allowtransparency="true" frameborder="0" scrolling="0" width="156" height="30"><
Copy to clipboard
&lt;/button&gt;</code></pre>
<h1 id="advanced-usage">Advanced Usage</h1>
<p>If you don't want to modify your HTML, there's a pretty handy imperative API for you to use. All you need to do is declare a function, do your thing, and return a value.</p>
<p>For instance, if you want to dynamically set a <code>target</code>, you'll need to return a Node.</p>
<pre><code class="js">new Clipboard('.btn', {
target: function(trigger) {
return trigger.nextElementSibling;
}
});</code></pre>
<p>If you want to dynamically set a <code>text</code>, you'll return a String.</p>
<pre><code class="js">new Clipboard('.btn', {
text: function(trigger) {
return trigger.getAttribute('aria-label');
}
});</code></pre>
<h1 id="events">Events</h1>
<p>There are cases where you'd like to show some user feedback or capture what has been selected after a copy/cut operation.</p>