Search code examples
javascriptjqueryhtmlcssdrupal-6

Javascript / jQuery loading (conflict)

I'm trying to load in a few jQuery files, a drupal 6 slideshow, flexslider carosel, modernize and a bootstrap modal.

I would just like to say I am including jquery from google cdn and putting a no conflict to load the flex slider - if I take the flexslider load away the Slideshow works. Weird. 

<script type="text/javascript">
 $.noConflict();
 jQuery(window).load(function() {
  jQuery('.flexslider').flexslider({
  controlNav: false, 
    animation: "slide",
    animationLoop: false,
    itemWidth: 162,
    itemMargin: 5
  });
});
</script>

All are working fine, except the drupal 6 slideshow. It returns this error in chrome - 

Uncaught TypeError: Property '$' of object [object Window] is not a function

I know drupal 6 is bring in version 1.4 of jquery and I also have google 1.7 cdn in there, but I do have a no conflict bit of code working.

Any help on getting this slider to load would be much appreciated.

Side note -Any reason why modernizer is putting a very subtle light white background over my ENTIRE webpage?

Solution

  • Most of the time, you don't need to use jQuerys noConflict option. When you use noConflict, $ sign is no more refers to jQuery and most plugins depending on the jQuery use $ to access it.

    Your slide also wants to access Jquery via $ but you used noConflict and removed the reference that your plugin uses.

    Just remove noConflict and you'll be fine.