I have a web application using Zurb Foundation5.3.3 and would like to intergrate the off-canvas functionality.
For some reason I can't get it to work, nothing happens when the activation link is clicked
Please see this http://jsfiddle.net/v1880qb7/1/
My off canvas code is here:
<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>
This is because of bad external resources. You need the file foundation.min.js
( link ) or both of files foundation.js
( link ) and foundation.offcanvas.js
( link ).
From the ZURB Foundation documentation :
Then either load each plugin individually, or include
foundation.min.js
, which automatically loads the Foundation Core and all JavaScript plugins.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>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.