Adding example for custom event binding.

1 files changed, 16 insertions, 0 deletions

diff --git a/index.html b/index.html
index 5346e34..0e30911 100644
--- a/index.html
+++ b/index.html
@@ -143,6 +143,18 @@
 					</section>
 				</section>
 
+				<section data-state="customevent">
+					<h2>Custom Events</h2>
+					<p>
+						Additionally custom events can be triggered on a per slide basis by binding to the <code>data-state</code> name.
+					</p>
+					<p><code style="font-size: 27px;">
+						document.addEventListener('customevent', function(){<br />
+							alert('event has fired');<br />
+						});
+					</code></p>
+				</section>
+
 				<section>
 					<h2>Clever Quotes</h2>
 					<p>
@@ -250,6 +262,10 @@
 				query[ a.split( '=' ).shift() ] = a.split( '=' ).pop();
 			} );
 
+			document.addEventListener('customevent', function(){
+				alert('event has fired');
+			});
+
 			Reveal.initialize({
 				// Display controls in the bottom right corner
 				controls: true,