I'm currently integrating modals using Foundation 5 in a Rails application.
The issue I'm facing is that the modal only works when the page is not scrolled down.
If you scroll to the bottom of the page and try to activate the modal by clicking the button, it doesn't show up.
Is this a bug or am I missing something?
<%= link_to "Register to Unlock", new_subscription_path, class:"unlock", "data-reveal-id" => "firstModal" %>
<!-- Reveal Modals begin -->
<div id="firstModal" class="reveal-modal" data-reveal aria-labelledby="firstModalTitle" aria-hidden="true" role="dialog">
<h2 id="firstModalTitle">This is a modal.</h2>
<p>Reveal makes these very easy to summon and dismiss. The close button is simply an anchor with a unicode character icon and a class of <code>close-reveal-modal</code>. Clicking anywhere outside the modal will also dismiss it.</p>
<p>Finally, if your modal summons another Reveal modal, the plugin will handle that for you gracefully.</p>
<p><a href="#" data-reveal-id="secondModal" class="secondary button">Second Modal...</a></p>
<a class="close-reveal-modal" aria-label="Close">×</a>
</div>
<div id="secondModal" class="reveal-modal" data-reveal aria-labelledby="secondModalTitle" aria-hidden="true" role="dialog">
<h2 id="secondModalTitle">This is a second modal.</h2>
<p>See? It just slides into place after the other first modal. Very handy when you need subsequent dialogs, or when a modal option impacts or requires another decision.</p>
<a class="close-reveal-modal" aria-label="Close">×</a>
</div>