How can I find out what precisely is the conflict between 2 jquery scripts?

Question

I am building a site on top of the Shopify platform and on one page a javascript conflict occurs. I have no idea how I can find out what exactly causes the conflict - any info on how I can find this out would be greatly appreciated!

Here is the gist:

This is the page I am using as a test page. Unless I mute the scripts.js the click function on the filters of the isotope script does not do anything.

This is from the html file in question:

  <!-- conflict!
  << path to 'scripts.js' >>
  -->

  <!-- Begin Isotope -->
  << path to 'jquery.isotope.min.js' >>

  <script>
    $(window).load(function(){

      var $container = $('#isocontainer'),
          $filterLinks = $('#isofilters a');

      $container.isotope({
        itemSelector: '.item',
        filter: '*'
      });

      $filterLinks.click(function(){
        var $this = $(this);

        // don't proceed if already selected
        if ( $this.hasClass('selected') ) {
          return;
        }

        $filterLinks.filter('.selected').removeClass('selected');
        $this.addClass('selected');

        // get selector from data-filter attribute
        selector = $this.data('filter');

        $container.isotope({
          filter: selector
        });
      });
    });
  </script>
  <!-- End Isotope -->

I'd be happy with any hints on how I can find out what the concrete conflict is. Let me know if I need to provide more/different information.

Thanks, Alex

score 0 · Answer 1 · answered Jun 24 '13 at 19:02

Are you loading JQuery first?

My guess is that there's an issue with using the $ operator in the Scripts.Js file. Is there a reason to use Jquery(window)....over $(window)? Same with Jquery(document).ready(..over $(document).ready(....?

You should be able to just use $ instead of JQuery.

score 0 · Answer 2 · answered Jun 24 '13 at 19:07

I cant understand your question fully . I think your jquery script is conflicting with other library .If this is the problem check the below script

var hack = $.noConflict();

Use hack instead of $ in every part of the script where you uses $ .

Greetings

How can I find out what precisely is the conflict between 2 jquery scripts?

2 Answers2