modal dialog – Opening Foundation Reveal on Click & Callback Functions?

modal dialog – Opening Foundation Reveal on Click & Callback Functions?

A Reveal modal can be opened in two ways, by attribute:

<a href=# data-reveal-id=myModal>Click Me For A Modal</a>
 <div id=myModal class=reveal-modal>
      <h2>Awesome. I have it.</h2>
      <p class=lead>Your couch.  It is mine.</p>
      <p>Im a cool paragraph that lives inside of an even cooler modal. Wins</p>
      <a class=close-reveal-modal>&#215;</a>
    </div>

or by javascript:

<a class=large button onclick=javascript:showModal(); href=#>Show Modal</a>

<script>
     $(#myModal).foundation(reveal, {
          opened: function () {
              alert(The couch was stolen!);
          },
          closed: function () {
              alert(Now its yours again);
          }
     });
     $(document).foundation();
     function showModal() {
         $(#myModal).foundation(reveal, open);          
     }
</script>

You can also bind the open, opened, close, and closed events.

#CoffeeScript
$(div[class$=-modal]).on opened, ->
  console.log howdy

modal dialog – Opening Foundation Reveal on Click & Callback Functions?

Please use below code

   $(#modal_id).bind(closed, function() {
     console.log(myModal closed!);
   });

Leave a Reply

Your email address will not be published. Required fields are marked *