jquery.ui.tabs.js doesn't load tab data in IE9, Chrome - works perfectly fine in firefox

Question

I have few issues that I am facing on my site and I have no idea how to fix those.

Please go to http://link.zambeel.ca/index.php/component/obituary/detail/52 and click on Photos tab, it doesn't load images promptly in IE9 and Chrome. I have made it work in firefox with the following code:

var loadNextTab = function() {
if (indexesToLoad.length == 0) return;
var index = indexesToLoad.shift();
$("#tabs-1").tabs("load",index);
};

$("#tabs-1").tabs({
cache: true,
load: loadNextTab
});

Please help me resolve this matter as soon as possible.

Just to let you guys know, I am not a programmer by any means.

Answer 1

When I accessed the URL you posted above on IE 9, it threw me the below error in the error console.

Unable to get value of the property 'tabs': object is null or undefined

Now, this error generally comes up if your JavaScript gets loaded before your HTML does. To prevent this, put all your above code in a ready event as

$(document).ready(function() {
  // All code you posted above should come in here which initializes the tabs.
});