Question

在尝试使用Foundation Reveal创建模态时，我发现无法关闭它。不是通过使用reveal-modal-close类，而不是使用javascript，没有任何工作。

我试图将这个示例从文档中放到页面中：

<div id="myModal" class="reveal-modal" data-reveal>
  <h2>Awesome. I have it.</h2>
  <p class="lead">Your couch.  It is mine.</p>
  <p>I'm a cool paragraph that lives inside of an even cooler modal. Wins!</p>
  <a class="close-reveal-modal">&#215;</a>
</div>

页面加载时，它已打开，但我无法关闭它。此外，不知道为什么它加载打开。

在<body>的底部，我有这个：

<script src="//ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.6.2.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.3.1/js/foundation.min.js">      </script>
<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.3.1/js/foundation/foundation.reveal.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/flexslider/2.2.2/jquery.flexslider-min.js"></script>
<script src="//code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="js/smooth-scroll.js"></script>
<script type="text/js" src="js/modal.js"></script>

<script>
  $(document).foundation();  
</script>

Answer 1

你不需要加载foundation.min和foundation.reveal，只需加载min，除非你只需要显示。你也不需要modal.js - 可能是那里的冲突。

请参阅此处的文档并按照该文档解决上述问题后应该运行：http://foundation.zurb.com/docs/components/reveal.html

Foundation Reveal Modal不会关闭

1 个答案: