0

I have created a theme from scratch using the CSS of Foundation 5, by overriding the Magento base template. Everything is fine with the CSS. However, when I include the Javascript of Foundation, some Magento plugins aren't working anymore.

So my question is: What is the proper way to include Foundation 5 and all of it's javascript features?

Here is the site I am using it goo.gl/OaE08J .

Thank you in advance

Improve this question
4
  • possible issue can be the conflict between prototypejs and the js used by Foundation 5, BTW which js does it use??
    – Deepak Mallah
    Commented Apr 2, 2014 at 8:48
  • It is using Prototype 1.7.
    – Klevis Miho
    Commented Apr 2, 2014 at 9:39
  • I'm no expert in Founsation 5, but from what I can see it uses jquery. If this is the case you have to use jQuery.noConflict()
    – Yiorgos Moschovitis
    Commented Apr 2, 2014 at 10:06
  • I have added the noConflict(), no results.
    – Klevis Miho
    Commented Apr 2, 2014 at 10:34

1 Answer 1

Reset to default
1

It will be causing a conflict with prototype, the $ variable is used by both jQuery and Prototype.

To include Foundation or any jQuery you will either need to namespace your plugins or call noConflict, I use the following:

jQuery.noConflict();
jQuery(document).ready(function($) {
    $(document).foundation();
});

This way you can still use the familiar $ syntax in jQuery.

You can read more here: https://api.jquery.com/jQuery.noConflict/

Improve this answer
1
  • It still doesn't work. Here goo.gl/SUXMIU . If you click one of the icons on the footer, there displays a modal(Foundations Revealer). But I have installed a image zoom plugin, which doesn't work when I try to load the Foundation javascripts.
    – Klevis Miho
    Commented Apr 2, 2014 at 13:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.