Javascript Conflict! Please help!

[reflex84 2]

Hi,Okay, I'm not very good with Javascript, so I seriously need help here. I'm sick of these javascripts conflicting making other javascripts not work.I've got 3 javascripts on my website:1) Digital Clock2) Date Picker3) and a Toggle Hide Show content effect javascript.Without the toggle script, the digital clock and date picker work just fine!When I add the Toggle script ... both the digital clock and date picker doesn't work!I've read about No.conflict but I have no idea what they are talking about... maybe its something less complicated?Here is my Javascript codes:

<link rel="stylesheet" href="datepicker/development-bundle/themes/base/jquery.ui.all.css">	<script src="datepicker/development-bundle/jquery-1.5.1.js"></script>	<script src="datepicker/development-bundle/ui/jquery.ui.core.js"></script>	<script src="datepicker/development-bundle/ui/jquery.ui.widget.js"></script>	<script src="datepicker/development-bundle/ui/jquery.ui.datepicker.js"></script>	<link rel="stylesheet" href="datepicker/development-bundle/demos/demos.css">	<script>	$(function() {		$( "#datepicker, #datepicker2, #datepicker3, #datepicker4, #datepicker5, #datepicker6, #datepicker7, #datepicker8, #datepicker9, #datepicker10, #datepicker11, #datepicker12" ).datepicker({			numberOfMonths: 3,			showButtonPanel: true		});	});	</script>	<script src="jquery.MyDigitclock.js"></script><script>$(function(){			$("#clock1").MyDigitClock();			$("#clock2").MyDigitClock({				fontSize:50,				fontFamily:"Arial",				fontColor: "#000",				fontWeight:"bold",				bAmPm:true,				background:'#fff',				bShowHeartBeat:true				});			$("#clock3").MyDigitClock({				fontSize:150,				fontColor:"grey",				background:"#fff",				fontWeight:"bold",				timeFormat: '{HH}<span id="ch1">:</span>{MM}'}			);		});function MM_openBrWindow(theURL,winName,features) { //v2.0  window.open(theURL,winName,features);}</script><script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script><script type="text/javascript">$(document).ready(function(){   	$(".toggle_container").hide();	$("h2.trigger").click(function(){		$(this).toggleClass("active").next().slideToggle("slow");	});});</script>

Please, if you could me - I'd appreciate it! Thanks

[trevelluk 0]

First of all, this is a Javascript question, not a Java question (despite the similarity of the names, they're very definitely not the same thing). You're certainly not the first to make that mistake though!I suspect that the problem is that you're including two copies of JQuery, which is a widely used JavaScript library:

<script src="datepicker/development-bundle/jquery-1.5.1.js"></script>.....<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

Try removing one of those lines (it probably doesn't matter which one) and see if that fixes things.

[reflex84 2]

Oh!! Haha ... sorry was obviously rushing to post this question and didn't look properly!Anyway ... I'll try that out and I'll let you know the result.Thanks!

[thescientist 231]

no conflict is a jQuery method for 'giving up' the $ namespace.http://api.jquery.com/jQuery.noConflict/you should also be checking for errors in your browsers console. If the conflict is between the two includes (or anything else for that matter) it would show up there.

Edited June 6, 2011 by thescientist