Fancybox doesn't work with jQuery v1.9.0 [ f.browser is undefined / Cannot read property 'msie' ]

Question

Fancybox breaks with the new jQuery v1.9.0.

It affects both, Fancybox v1.3.4 and below - and - v2.1.3 and below.

The errors shown are :

v1.3.4 :

Timestamp: 15/01/2013 10:03:28 AM Error: TypeError: b.browser is undefined Source File: ...fancybox/jquery.fancybox-1.3.4.pack.js Line: 18 

... other errors

Uncaught TypeError: Cannot read property 'msie' of undefined jquery.fancybox-1.3.4.pack.js:18 Uncaught TypeError: Object [object Object] has no method 'fancybox' 

In v2.1.3 :

Timestamp: 15/01/2013 10:09:58 AM Error: TypeError: $.browser is undefined Source File: h.../fancybox2.1.3/jquery.fancybox.js Line: 139 

If you are using this to call jQuery :

<script src="http://code.jquery.com/jquery-latest.js"></script> 

... any of your existing fancybox implementations will fail!!

Answer 1

It seems like it exists a bug in jQuery reported here : http://bugs.jquery.com/ticket/13183 that breaks the Fancybox script.

Also check https://github.com/fancyapps/fancyBox/issues/485 for further reference.

As a workaround, rollback to jQuery v1.8.3 while either the jQuery bug is fixed or Fancybox is patched.

---

UPDATE (Jan 16, 2013): Fancybox v2.1.4 has been released and now it works fine with jQuery v1.9.0.

For fancybox v1.3.4- you still need to rollback to jQuery v1.8.3 or apply the migration script as pointed out by @Manu's answer.

---

UPDATE (Jan 17, 2013): Workaround for users of Fancybox v1.3.4 :

Patch the fancybox js file to make it work with jQuery v1.9.0 as follow :

1. Open the jquery.fancybox-1.3.4.js file (full version, not pack version) with a text/html editor.

2. Find around the line 29 where it says :

   isIE6 = $.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest, 

   and replace it by (EDITED March 19, 2013: more accurate filter):

   isIE6 = navigator.userAgent.match(/msie [6]/i) && !window.XMLHttpRequest, 

   UPDATE (March 19, 2013): Also replace $.browser.msie by navigator.userAgent.match(/msie [6]/i) around line 615 (and/or replace all $.browser.msie instances, if any), thanks joofow ... that's it!

Or download the already patched version from HERE (UPDATED March 19, 2013 ... thanks fairylee for pointing out the extra closing bracket)

NOTE: this is an unofficial patch and is unsupported by Fancybox's author, however it works as is. You may use it at your own risk ;)

Optionally, you may rather rollback to jQuery v1.8.3 or apply the migration script as pointed out by @Manu's answer.

Answer 2

Hi this is due to new version of the jQuery => 1.9.0

you can check the update : http://blog.jquery.com/2013/01/15/jquery-1-9-final-jquery-2-0-beta-migrate-final-released/

jQuery.Browser is deprecated. you can keep latest version by adding a migration script : http://code.jquery.com/jquery-migrate-1.0.0.js

replace :

<script src="http://code.jquery.com/jquery-latest.js"></script> 

by :

<script src="http://code.jquery.com/jquery-latest.js"></script> <script src="http://code.jquery.com/jquery-migrate-1.0.0.js"></script> 

in your page and its working.