Foundation5 Off-canvas无法正常工作

时间:2015-02-18 02:24:29

标签: javascript html5 zurb-foundation

我有一个使用Zurb Foundation5.3.3的Web应用程序,并希望整合画布外功能。

出于某种原因,我无法让它工作,点击激活链接时没有任何反应

请参阅此http://jsfiddle.net/v1880qb7/1/

我的画布代码在这里:

<div class="off-canvas-wrap" data-offcanvas>
    <div class="inner-wrap">

        <a class="left-off-canvas-toggle" href="#" >Calendar</a>

        <!-- Off Canvas Menu -->
        <aside class="left-off-canvas-menu">
            <!-- whatever you want goes here -->

            <p> This is test content.</p>
            <div id="flat_calendar1"></div>
            <div id="flat_calendar2"></div>
            <div id="flat_calendar3"></div>
            <div id="flat_calendar4"></div>
            <div id="flat_calendar5"></div>
            <div id="flat_calendar6"></div>
            <div id="flat_calendar7"></div>
            <div id="flat_calendar8"></div>

        </aside>

        <!-- close the off-canvas menu -->
        <a class="exit-off-canvas"></a>

    </div>
</div>

1 个答案:

答案 0 :(得分:0)

这是因为外部资源不好。您需要文件foundation.min.jslink)或两个文件foundation.jslink)和foundation.offcanvas.jslink)。

来自ZURB基金会documentation

  

然后单独加载每个插件,或者包括   foundation.min.js,自动加载基础核心和   所有JavaScript插件。

     

HTML

<script src="/js/foundation.min.js"></script>

<!-- or individually -->

<script src="/js/foundation.js"></script>
<script src="/js/foundation.alert.js"></script>
<!-- ... -->
<script src="/js/foundation.dropdown.js"></script>
<script src="/js/foundation.tab.js"></script>

Updated Fiddle