No Conflict Jquery Script


Im Actually Desigining a Single page Web Template which uses 2 or more Java and jquery
Scripts the site works perfect in IE and FF But not in Chrome

im Not Pretty Sure how to use the no conflict Script in Jquey

This is my Markup For Scripts

<link href="style.css" rel="stylesheet" type="text/css">
<script src="" type="text/javascript"></script>
<script src="js/jquery.anchor.js" type="text/javascript"></script>
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/lightbox.js"></script>
<script type="text/javascript">
  // Code that uses other library's $ can follow here.

Your help is Really Appreciated

thanks guys


jQuery’s noConflict() method is used to relinquish jQuery’s control of the $ variable.
You might want to do this if another JavaScript library you are using wants use $ as a function or variable name.

The correct order to include your scripts when using noConflict() is:
noConflict code
libraries which need to overridethe $ variable

In your case that would probably be:

<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/jquery.anchor.js" type="text/javascript"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script src="js/lightbox.js"></script>

This is assuming that jquery.anchor.js wants to use the $ variable, but lightbox.js wants to override it.

Please also be aware that after your no conflict code you wouldn’t write $("#content"), but jQuery("#content").

You can also do this: $j = jQuery.noConflict(true);, which means you can then write $j("#content").


P.S. Please be aware that it is not a good idea to include two different versions of jQuery as you had done in your original code. It is also quite possible that this is causing you problems, too.