Member Avatar for miguel1810

Okay... Im still on a big learning curve with Java / JQuery etc...

I have easyslider and jcarousel running fine on the page... but I also want to add in jquery.ticker but im getting conflicts with the code - but when I remove:

<script src="js/jquery.ticker.js" type="text/javascript"></script>
<script src="js/site.js" type="text/javascript"></script>

It works fine with easyslider and jcarousel - but of course no jquery.ticker

Any pointers on what I need to do to get all three JQuery code to work together within the page would be really helpful.

<script type="text/javascript" src="js/jquery-1.6.2.js"></script>
<script type="text/javascript" src="js/easySlider1.5.js"></script>
<script src="scripts/swfobject_modified.js" type="text/javascript">
</script><script src="js/jcarousellite_1.0.1c4.js" type="text/javascript"></script>
<script type="text/javascript" src="js/1.6.2/jquery.min.js"></script> 

<script src="js/jquery.ticker.js" type="text/javascript"></script>
<script src="js/site.js" type="text/javascript"></script>
    
    
<script type="text/javascript">
$(function() {
	$(".newsticker-jcarousellite").jCarouselLite({
		horizontal: true,
		hoverPause:true,
		visible: 10,
		auto:500,
		speed:1000
	});
});
</script>
<script type="text/javascript" charset="utf-8">
// <![CDATA[
$(document).ready(function(){	
	$("#slider").easySlider({
		controlsBefore:	'<p id="controls">',
		controlsAfter:	'</p>',
		auto: true, 
		continuous: true
	});	
});
// ]]>
</script>

Thanks

Miguel

Edited by peter_budo because: Do not use CODE SNIPPET to posts questions! Use Discussion Thread
  • 3 Contributors
  • 4 Replies
  • 146 Views
  • 2 Weeks Discussion Span
  • Latest Post Latest Post by floatingDivs
Member Avatar for floatingDivs

Are they all referencing a jQuery file? If so, you'd be pulling in 3 diff. copies of jQuery, which would cause it to stop working unless you use a function that loads only one version of it.

Member Avatar for miguel1810

Are they all referencing a jQuery file? If so, you'd be pulling in 3 diff. copies of jQuery, which would cause it to stop working unless you use a function that loads only one version of it.

Duh! Why do you think I posted this request - of course pulling in the three different JQuery files stops all versions working - so... Im looking for some advice/help/assistance on how to reference one Master file which will enable all three functions to work on the page...

So... do you have the answer ? Or do you just state what I already know ?

commented: You needn't act like a jerk to those who are trying to help. -3
commented: Really silly post. Consider using far more descriptive posts when asking for help. Also, it's javaSCRIPT not java. -1
Member Avatar for Airshow

Unless there's very good reason to do otherwise (and then only if you know what you are doing) load just one copy of jQuery. The .min version is the one to use.

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

<script type="text/javascript" src="js/easySlider1.5.js"></script>
<script type="text/javascript" src="scripts/swfobject_modified.js"></script>
<script type="text/javascript" src="js/jcarousellite_1.0.1c4.js"></script>
<script type="text/javascript" src="js/jquery.ticker.js"></script>
<script type="text/javascript" src="js/site.js"></script>

<script type="text/javascript">
$(function() {
	//Here you can set up the carousel and easySlider (and other things) in the same $(function() {...} structure.
	$(".newsticker-jcarousellite").jCarouselLite({
		horizontal: true,
		hoverPause:true,
		visible: 10,
		auto:500,
		speed:1000
	});
	$("#slider").easySlider({
		controlsBefore:	'<p id="controls">',
		controlsAfter:	'</p>',
		auto: true, 
		continuous: true
	});	
});
</script>

The three plugins easySlider, jcarousellite and ticker should be mutually compatible in themselves. I would comment out swfobject_modified.js and site.js while testing the plugins.

Now check that $(".newsticker-jcarousellite").jCarouselLite({...}); and $("#slider").easySlider({...}); work individually by commenting out each in turn.

If they both work individually, do they work together?

If they don't work together, try swapping thee two blocks $(".newsticker-jcarousellite").jCarouselLite({...}); and $("#slider").easySlider({...}); .

If they still don't work, then maybe the HTML needs looking at.

Airshow

Member Avatar for floatingDivs

Duh! Why do you think I posted this request - of course pulling in the three different JQuery files stops all versions working - so... Im looking for some advice/help/assistance on how to reference one Master file which will enable all three functions to work on the page...

So... do you have the answer ? Or do you just state what I already know ?

Well, I'm left speechless. You have the audacity to throw insults around when requesting help. Even worse, you're doing so after 20 days have passed and you've been unable to come up with a solution. Laughable.

Consider reading my post more closely and try to think about what I'm saying. If each JavaScript file references its own jQuery, you're loading 3 different copies -- which you claimed you knew -- and yet you're confused as to why you're having issues? You should be loading only one copy of jQuery to prevent conflicts.

As for a possible solution, consider removing the references to jQuery made by each file and just include a <script> pointing to jQuery.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.