Jquery Carousel getting error: "Cannot read property 'safari' of undefined"

Question

I have installed a duplicate of my site on a dev directory and have discover jQuery Carousel is no longer working.

I now get the error:

Uncaught TypeError: Cannot read property 'safari' of undefined

I don't understand this as I am testing on Chrome and Firefox.

Furthermore, this error is not occurring on the production version of the site - only the dev version.

I have updated jQuery, jQuery-UI and the version of jQuery Carousel as well as testing that all files are present but the problem persists.

Would anyone know what's going on and how to fix it?

My Carousel code is:

jQuery(document).ready(function($){
    $('#mycarousel').jcarousel({
      vertical: true,
      scroll: 2
    });
  });

And if any wants a look a dev version of the site is here: http://www.dev.wakeup.com.au/

Answer 1

The problem might be that the plugin uses $.browser. This has been deprecated and removed in jQuery version 1.9, as stated in their upgrade logs: http://api.jquery.com/jquery.browser/

Description: Contains flags for the useragent, read from navigator.userAgent. This property was removed in jQuery 1.9 and is available only through the jQuery.migrate plugin. Please try to use feature detection instead.

If this is the case, the plugin uses the (frowned-upon) browser sniffing techniques to achieve cross browser compatibility.

You might test the plugin with a version of jQuery before 1.9. If you need a newer version of jQuery, have a look at the plugin's page if there are any new versions available that fix this incompatibility with new jQuery versions.