Moves advanced section to the bottom

This commit is contained in:
Zeno Rocha 2015-10-03 19:16:33 -07:00
parent 5bac064b52
commit 9abeb45708

View File

@ -134,6 +134,29 @@ allowtransparency="true" frameborder="0" scrolling="0" width="156" height="30"><
Copy to clipboard
&lt;/button&gt;</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>
<p>That's why we fire custom events such as <code>success</code> and <code>error</code> for you to listen and implement your custom logic.</p>
<pre><code class="js">var clipboard = new Clipboard('.btn');
clipboard.on('success', function(e) {
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
e.clearSelection();
});
clipboard.on('error', function(e) {
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
});</code></pre>
<p>For a live demonstration, just open your console :)</p>
<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>
@ -159,29 +182,6 @@ allowtransparency="true" frameborder="0" scrolling="0" width="156" height="30"><
<pre><code class="js">var clipboard = new Clipboard('.btn');
clipboard.destroy();</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>
<p>That's why we fire custom events such as <code>success</code> and <code>error</code> for you to listen and implement your custom logic.</p>
<pre><code class="js">var clipboard = new Clipboard('.btn');
clipboard.on('success', function(e) {
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
e.clearSelection();
});
clipboard.on('error', function(e) {
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
});</code></pre>
<p>For a live demonstration, just open your console :)</p>
<h1 id="browser-support">Browser Support</h1>
<p>This library relies on both <a href="https://developer.mozilla.org/en-US/docs/Web/API/Selection">Selection</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand">execCommand</a> APIs. The second one is supported in the following browsers.</p>