SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Nov 2012
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Post No Conflict Jquery Script

    Hi,

    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

    Code:
    <link href="style.css" rel="stylesheet" type="text/css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js" 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">
      $.noConflict();
      // Code that uses other library's $ can follow here.
    </script>
    Your help is Really Appreciated

    thanks guys
    Last edited by Shyflower; Nov 10, 2012 at 13:59. Reason: added code tags

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,938
    Mentioned
    214 Post(s)
    Tagged
    12 Thread(s)
    Howdy,

    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:
    jQuery
    noConflict code
    libraries which need to overridethe $ variable

    In your case that would probably be:
    HTML Code:
    <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").

    HTH

    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.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •