enter image description here

im trying to run this small image magnifier, but it keeps conflicting with my menu, so is there any code i can insert into this to run the jquery in no conflict mode so it doesnt break any of magento's jquery


This question seems to be not much clear. But I would like to share some thoughts in order to avoid jquery conflicts.

uses by default. Since it uses jquery, it is recommended to stick with this default jquery package.

Default jquery is loading from the directory js/lib/jquery/jquery-1.10.2.min.js. If you inspect further you can also see an another jquery file (at /js/lib/jquery/noconflict.js) which is using to avoid jquery conflicts. This is the content of that js file.

// Avoid PrototypeJS conflicts, assign jQuery to $j instead of $
var $j = jQuery.noConflict();

Look at the comment. It says, you should use $j istead of $. That means in order to avoid conflicts, you need to ensure three things.

1) Do not use new jquery package, stick with default one. You dont bother about this step. Magento will load its jquery for you. So please dont add jquery again.

2) Make sure noconflict.js is loading just after default jquery library. This is also managed by default Magento.

3) Now add your magnifier library js file if any (optional step. Requires only when magnifier technique is relying on any jquery package).

4) Use your custom js file which uses magnifier js library. In this file, instead of using $, you should use $j everywhere. This way Magento will not make any jquery conflicts.

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