I think I have a clash between two scripts I’d like to run together.
However, I know very little about this language. Anyone be willing to look at a couple files and see if there is a fix to prevent the clash?
Thanks in advance.
Yup, sure thing.
Would be great if you could post a link to the page and if no one gets there before me, I’ll have a look at it tomorrow morning (+9 hours from now)
Great. Thanks again.
This is the one I NEED to work.
http://theturtleroom.com/wp-content/plugins/jigoshop/assets/js/variable.js
It operates a function in the new area of the site. The product option on this page: http://theturtleroom.com/product/turtle-hotpad/
The option select works in IE9, but not in Chrome. (it has a background function for creating these variable products which only works in Chrome, not IE9)
The files it is clashing with are (one of?) these:
http://theturtleroom.com/wp-content/themes/spicy1-9/js/galleria_slider_init.js
http://theturtleroom.com/wp-content/themes/spicy1-9/js/galleria.classic.min.js
http://theturtleroom.com/wp-content/themes/spicy1-9/js/galleria.min.js
These operate galleries like on this page: http://theturtleroom.com/projects/steve-projects/chrysemys/chrysemys-dorsalis/
These galleries work in IE9, but not in Chrome.
It seems that IE9 and Chrome give different priorities to the two JQuery plugins, thus why different things work on each browser. Anyway, the makers of the shop plugin agree that its a clash between these two items.
Hi reedbird8
It has nothing to do with the javascript. The problem you’re having is that you can’t “click” on the select-field, right?
That’s because the div with the class “product_meta” is actually over the select-field. (I used Firebug for Firefox to find the problem)
If you just change the following CSS in “frontend.css” (It fixes this problem, but it might create other lay-out problems on other pages, so be sure to check some of your pages :))
div.product div.product_meta, div.product div.variations_button {
clear: left;
}
to
div.product div.product_meta, div.product div.variations_button {
clear: both;
}
The select-fields works fine for me now 
That was only one of the issues. If that’s all it takes to fix that one, then that’s pretty simple. Thanks…it is fixed!
However, those galleries I mentioned toward the bottom of the post aren’t working because of the clash as well. So it turns out then, the clash is simply between a backend function and a front-end function. There is a button in the admin area of a plugin that does NOT work in IE9, but works in Chrome. Where those scrollers I mentioned work in IE9, but NOT in Chrome.
I’ll adapt my original request to what still needs fixed:
This is the one I NEED to work.
http://theturtleroom.com/wp-content/plugins/jigoshop/assets/js/variable.js
It operates an admin function (Creating varations of the variable product type) in the shop I’m building for the site. The function is only working in Chrome, not IE9.
The files it is clashing with are (one of?) these:
http://theturtleroom.com/wp-content/themes/spicy1-9/js/galleria_slider_init.js
http://theturtleroom.com/wp-content/themes/spicy1-9/js/galleria.classic.min.js
http://theturtleroom.com/wp-content/themes/spicy1-9/js/galleria.min.js
These operate galleries like on this page: http://theturtleroom.com/projects/steve-projects/chrysemys/chrysemys-dorsalis/
These galleries work in IE9, but not in Chrome.
It seems that IE9 and Chrome give different priorities to the two JQuery plugins, thus why different things work on each browser. Anyway, the makers of the shop plugin agree that its a clash between these two items.
Howdy,
The problem is with the file “tooltipfunction-footer.js” at the bottom of the page.
Commenting this line out makes everything work in Chrome.
The reason it’s throwing an error, is that in line 83 of the file, jQuery is trying to call replace on the contents of a div with the id of “sp_classification”. This div however doesn’t exist on the page.
So, how can I have it call that line when it exists on a page and not on another page?
Do you mean that the div#sp_classification exists on some pages, but not others?
right
Use this:
if($("#sp_classification ").length != 0) {
alert("The div exists. Give me a free turtle");
}
Oh, looking at your code that should be:
if(jQuery("#sp_classification ").length != 0) {
alert("The div exists. Give me a free turtle");
}
haha! Thanks again, Pullo! You’re great!
Pleasure, as always.
Doesn’t seem to fix, though…the gallery still doesn’t show up on Chrome…
http://theturtleroom.com/projects/steve-projects/chrysemys/chrysemys-dorsalis/
Does removing the script entirely make the gallery work?
Edit: I’ve just looked at line 83 of tooltip-footer.js and it looks like you haven’t changed anything.
Also, I notice you are using W3 Total Cache.
This is probably why you are not seeing the changes.
Try deactivating the plugin while you are debugging stuff.
It does work if I remove it…
I did change it…it now looks like this:
if(jQuery("#sp_classification").length != 0) {
jQuery('#sp_classification').html(jQuery('#sp_classification').html().replace(/(ESA)/g,'<a href="#" class="clickTip" title="<a href=\\'http://theturtleroom.com/educational-resources/esa\\' target=\\'blank\\'>U.S. Endangered Species Act (ESA)</a>">$1</a>'));
jQuery('#sp_classification').html(jQuery('#sp_classification').html().replace(/(CITES)/g,'<a href="#" class="clickTip" title="<a href=\\'http://theturtleroom.com/educational-resources/cites\\' target=\\'blank\\'>Convention on International Trade in Endangered Species of Wild Fauna and Flora (CITES)</a>">$1</a>'));
}
OK…so it works if this whole chunk is removed. Any idea how to fix it?
jQuery('#main_wrapper').html(jQuery('#main_wrapper').html().replace(tsd1a, tsd1aTip).replace(tsd1b, tsd1bTip).replace(tsd2, tsd2Tip).replace(tsd, tsdTip).replace(it, itTip).replace(pl, plTip).replace(scl, sclTip).replace(wc, wcTip).replace(ltc, ltcTip).replace(cb, cbTip).replace(at, atTip).replace(bt, btTip).replace(ccl, cclTip).replace(gsd, gsdTip).replace(ip, ipTip).replace(mtDNA, mtDNATip).replace(nDNA, nDNATip).replace(bm, bmTip).replace(wt, wtTip).replace(et, etTip));
if(jQuery("#sp_classification").length != 0) {
jQuery('#sp_classification').html(jQuery('#sp_classification').html().replace(/(ESA)/g,'<a href="#" class="clickTip" title="<a href=\\'http://theturtleroom.com/educational-resources/esa\\' target=\\'blank\\'>U.S. Endangered Species Act (ESA)</a>">$1</a>'));
jQuery('#sp_classification').html(jQuery('#sp_classification').html().replace(/(CITES)/g,'<a href="#" class="clickTip" title="<a href=\\'http://theturtleroom.com/educational-resources/cites\\' target=\\'blank\\'>Convention on International Trade in Endangered Species of Wild Fauna and Flora (CITES)</a>">$1</a>'));
}
I won’t be able to do any more work til this afternoon or tomorrow morning now. Thanks again, Pullo.
Hi,
could you put up a link to a page which is not working (you seem to have removed the offending code from the original).
Then’ll be happy to take a closer look.
Sorry, I had to step away from my machine. That chunk of code is back in the file. I don’t think I’ll get a chance to look at anything again until later today.