You don't have the relevant reveal CSS included or the necessary markup for the modal in your document:
If it were me, I would just strip out all of the Foundation stuff and use http://dimsemenov.com/plugins/magnific-popup/. I say this only because I think you will find it to require less work to integrate in your use case. Just add the stylesheet and script:
Give all of the links that should open within a popup a class like popup-iframe:
Initialize the popups:
- Code: Select all
<div id="myModal" class="reveal-modal" data-reveal>
<!-- modal content -->
</div>
If it were me, I would just strip out all of the Foundation stuff and use http://dimsemenov.com/plugins/magnific-popup/. I say this only because I think you will find it to require less work to integrate in your use case. Just add the stylesheet and script:
- Code: Select all
<link href="magnific-popup/magnific-popup.css" rel="stylesheet">
...
<script src="magnific-popup/jquery.magnific-popup.js"></script>
Give all of the links that should open within a popup a class like popup-iframe:
- Code: Select all
<a class="popup-iframe" href="<cms:show k_page_link />"><cms:show k_page_title /></a>
Initialize the popups:
- Code: Select all
<script>
$(document).ready(function() {
$(".popup-iframe").magnificPopup({
type: "iframe"
});
});
</script>