Search code examples
jqueryprototypejslightbox

jquery and prototype conflicts

I know this question has been asked many times, and I've searched stackoverflow and google for answers but none of them worked for me, so maybe my errors are caused in different areas, anyways here is my javascript includes

echo "<script type=\"text/javascript\" src=\"http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js\"></script>\n";

echo "<script type=\"text/javascript\" src=\"javascript/watermark.min.js\"></script>\n";
echo "<script type=\"text/javascript\" src=\"javascript/jquery.cycle.js\"></script>\n";
echo "<script type=\"text/javascript\" src=\"http://vjs.zencdn.net/c/video.js\"></script>\n";

echo "<script type=\"text/javascript\" src=\"javascript/prototype.js\"></script>\n";
echo "<script type=\"text/javascript\" src=\"javascript/scriptaculous.js?load=effects,builder.js\"></script>\n";
echo "<script type=\"text/javascript\" src=\"javascript/lightbox.js\"></script>\n";

echo "<script type=\"text/javascript\" src=\"javascript/jquery.userdrive.js\"></script>\n";

whenever I put prototype.js, scriptaculous.js and lightbox.js after jQuery library, my userdrive doesn't work, and when I put it before, it works but not completely. I know there is a conflict between the $ signs but I don't know how to fix this. Also, my userdrive includes ajax calls and code for sortable grid.

Solution

  • If your userdrive.js are using the global variable "$" without a closure it will fail because the prototype.js remove the link between "$" and "jQuery"

    This is a clousure:

    (function($){
  ...
})(jQuery)

    Try put your userdrive into a closure and uses the noConflict method to prevent other errors.

    <script type="text/javascript">
  jQuery.noConflict();
</script>