How to use Zurb Foundation reveal with open, opened, close, closed callback functions?
callback, dom-events, javascript, modal-dialog, zurb-foundation
Solution
Call `reveal` like you normally would, but include the name of the option and corresponding function as an object:
//Reveal the modal and say "Good bye" when it closes
$("#myModal").reveal({ "closed": function () { alert("Good bye") } });
Problem
On zurb foundation's website at http://foundation.zurb.com/docs/reveal.php they listed some Options including open: callback function that triggers 'before' the modal opens. opened: callback function that triggers 'after' the modal is opened. close: callback function that triggers 'before' the modal prepares to close. closed: callback function that triggers 'after' the modal is closed. But I have no idea how to use them with my modal. I tried: ``` $('#myModal').closed(function() {}); $('#myModal').trigger('reveal:closed')( {}); $('#myModal').reveal.closed(function() {}); $('#myModal').reveal().closed(function() {}); ``` I have Googled but found no hits. Anyone who can explain it or give me an example or provide a related link? The suggestion given works, however I have yet another closely related question for `reveal()`: ``` <a href="#" class="button" data-reveal-id="myModal2">Click Me For A Modal</a>); ``` I tried to add one attribute like `data-closeOnBackgroundClick="false"` That doesn't seem to work. What should be the correct syntax? Will it work for callback function as well?