PDA

View Full Version : Content Glider - possible jquery conflicts?



fensterbaby
04-06-2010, 11:13 PM
1) Script Title: Featured Content Glider

2) Script URL (on DD):

http://www.dynamicdrive.com/dynamicindex17/featuredcontentglider.htm


3) Problem:

When I load the FCG javascript it seems to create some sort of jquery conflict. Not only does the FCG script not work but all jquery scripts on the page shut down.

I have used the FCG script on other sites and pages so I know it works.

The tree menu in the left sidebar and Customer Comments image rotator (also in left sidebar) work on all other pages on the site so I know those are fine too. These elements use jquery.

But together they won't play nice. Am at a loss.

Page in question:

http://www.magicvacdirect.com/index.php

The only thing I could think of was the loading order of scripts.. but I'm no JS programmer so am now stuck.

Thanks for your help

Greg

fensterbaby
04-07-2010, 12:52 AM
I found this thread and implemented the suggestions there...

http://www.dynamicdrive.com/forums/showthread.php?t=29309

This did stop the conflict issues and the other jquery scripts on the page now run fine. But Featured Content Glider does not load.

Looked in the source and all the scripts seem to be loading.

??

GF

jscheuer1
04-07-2010, 01:56 PM
Works in all but IE. Here (around line #194 in your page's source code):


<script type="text/javascript">
jQuery(function($) {
$('#pic').crossSlide({
sleep: 6,
fade: 1,
shuffle: true,
}, [
{ src: '/images/custom/quotes/q_1.gif'},
{ src: '/images/custom/quotes/q_2.gif'},
{ src: '/images/custom/quotes/q_3.gif'},
{ src: '/images/custom/quotes/q_4.gif'},
]);});
</script>

No comma (red) after the last object in the array. That's a technical rule that most others now error correct for (didn't used to). IE hasn't added this to its error correction routines yet.

There could also be other problems. One thing I did notice (and if it works like this, it's not really a problem, just inefficient) was that you have both jQuery 1.3.2 and 1.4 on the page. You should only need one.

Also 1.4 wasn't real stable. 1.3.2 was, but 1.4.2 is the latest, fastest and is stable. There should be no backward compatibility issues with 1.3.2. So I'd try getting rid of (around line #68):


<script type="text/javascript" src="/js/jquery-1.4.min.js"></script>

And changing (around line #39):


<script type="text/javascript" src="content/vendors/jquery/jquery-1.3.2.min.js"></script>

to:


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

If that works out and you still want to host your own copy of jQuery, you may get it from the address in the src attribute. But letting Google host your script may speed page load, as many folks will already have it cached from that location.