You are my
mini Hero!
Ruud, are you sure you aren't a teacher or a Jedi??? You have the ability to say something that I have read about many times, and without spelling it out much more than those before you, inspire me to see what I have been missing. I still have to work at it a bit, which is not a bad thing, as I will always have more to learn along the way. Perhaps I am just starting to catch on to all this stuff finally, so things are beginning to fall into place.
I just had to move the foundation jquery call to the head, leaving the rest of the foundation calls at the bottom of the <body>, and now everything works beautifully.
<script src="<?php
echo TEMPLATE_DIR; ?>/js/vendor/jquery.js"></script>
<?php
// automatically include optional WB module files (frontend.css, frontend.js)
if (function_exists('register_frontend_modfiles')) {
register_frontend_m odfiles('css');
register_frontend_m odfiles('js');
} ?>
</head> <script src="<?php
echo TEMPLATE_DIR; ?>/js/vendor/what-input.js"></script>
<script src="<?php
echo TEMPLATE_DIR; ?>/js/vendor/foundation.js"></script>
<script src="<?php
echo TEMPLATE_DIR; ?>/js/app.js"></script>
</body>When I was first building my custom template, I put all the foundation calls in the <head> but the off-canvas function didn't work. So I did more research and found the appropriate Docs. What confused me was the instructions on the Foundation Docs page -
http://foundation.zurb.com/sites/docs/javascript.htmlThat state:
Once you have the files, add links to jQuery and Foundation as <script> tags at the bottom of your page, just before the closing <body> tag.
It doesn't specify that the placement is for page loading speed only, so I took it as a necessity and moved everything to the end of the body.
Actually, the only call that has to be at the bottom of the <body> is the app.js:
<script src="<?php
echo TEMPLATE_DIR; ?>/js/app.js"></script>which contains the Initializing function:
$(document).foundation()This is a custom responsive template I am creating which implements some foundation elements such as buttons and the off-canvas menu for smaller viewports. I was actually inspired to build this template by playing around with another of your progressive modules - Bootstrap Multiple Columns. I had initially planned to use it extensively, but it turns out I haven't needed to use it... yet. But your miniHero with parallax was a design "pop" element I was missing.
Thank you!
Support WebsiteBaker
