diff --git a/README.md b/README.md index 9a4810d..83aa0ec 100755 --- a/README.md +++ b/README.md @@ -258,18 +258,30 @@ With `addBodyClasses` set to `true` in your initialize options, one of the two c ### - How do I make a toggle button? Toggles have been a popular request, but rather than bog the library down with additional methods, you can utilize the powerful API of Snap.js to create your own toggle. Toggles can be done like the following: -```javascript -myToggleButton.addEventListener('click', function(){ - if( snapper.state().state=="left" ){ - snapper.close(); - } else { - snapper.open('left'); - } +#### Add Event Listener +```javascript +var addEvent = function addEvent(element, eventName, func) { + if (element.addEventListener) { + return element.addEventListener(eventName, func, false); + } else if (element.attachEvent) { + return element.attachEvent("on" + eventName, func); + } + }; +``` +#### Add Toggle Event +```javascript +addEvent(document.getElementById('open-right'), 'click', function() { + snapper.open('right'); }); ``` +#### Event Toggle Markup +```html +Toggle +``` + ### - How do I disable Snap.js dragging for my touch slider? Snap.js supports cascading cancellation of events via a data attribute `data-snap-ignore`. If you were to use a slider, your markup might look like the following: