Foundation Reveal Modal 超出可见区域答案

【问题标题】：Foundation Reveal Modal out of visible areaFoundation Reveal Modal 超出可见区域
【发布时间】：2015-12-04 20:13:40
【问题描述】：

我正在尝试通过在 Rails 应用程序中使用 Foundation 5 来使用模式

问题是，如果你没有向下滚动页面，模式就会起作用。

如果你到底部并单击模式的按钮，当它激活时，它是不显示的。

这是有错误还是我做错了什么？

<%= 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">&#215;</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">&#215;</a>
</div>

【问题讨论】：

如果您将 CSS 中的“显示模式”类设置为固定而不是绝对会发生什么？
谢谢你成功了！尽管很奇怪。这是一个错误吗？如果你想把你的答案，我会标记为正确！

标签： javascript jquery css ruby-on-rails zurb-foundation

【解决方案1】：

我不认为这是一个错误，应该根据您的情况对脚本进行修改。您可以通过将模式设置为“固定”而不是“绝对”来修改模式的 css 属性。请注意，在小屏幕上查看时要添加一些代码，因为模式可能太高并且存在溢出。

【讨论】：