Menu icon Foundation
How can I include a close button for iFrame modal windows?

I include the "close-reveal-modal" link as usual, but it doesn't show up. I have to click out side the modal to close the window...which is bad from a usability standpoint.

iframemodal

I include the "close-reveal-modal" link as usual, but it doesn't show up. I have to click out side the modal to close the window...which is bad from a usability standpoint.

Brandon Arnold about 4 years ago

This video is using an iFrame and the close button seems to be working.

http://codepen.io/zurbrandon/pen/jPKzeq

Can you share your code to help troubleshoot?

Richard Smith about 4 years ago

Correction: I'm trying to open an iframe via ajax.

<div class="thumbnail">
  <a href="http://popvideo.userhost.net/2014/10/07/close-call-for-rally-spectators/" data-reveal-id="myModal" data-reveal-ajax="true">
  <img width="480" height="270" src="http://popvideo.userhost.net/wp-content/uploads/sites/12/2015/11/close-call-for-rally-spectators-480x270.jpg" class="attachment-wide_feature wp-post-image" alt="Close-call for rally spectators" /></a>
        <div class="caption">
            <p><span>Close-call for rally spectators</span></p>
        </div>
    </div>

</li><li> 


...

<div id="myModal" class="reveal-modal xlarge" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog" style="top:0;">
  <a class="close-reveal-modal" aria-label="Close">&#215;</a>
</div>