Mootools and JQuery Integration

Question

Dear all I am using the code Mootool[1.11.] and JQuery[1.2.6],Its working fine when these are separate. While i am integrating firefox throws (document).ready(){} is not a function. Is any wrong in my concept, What to do to rectify it?.Any help

Answer 1

Jquery and Mootools both use '$' as a shorthand way of calling their main functions. The jquery team have built in a way to stop this so you can write something like:

jQuery(document).ready(function(){...});

Instead of

$(document).ready(function(){...});

This will let you use jquery and any other javascript library side by side. Read their docuentation on the subject - http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Answer 2

In addition to sanchothefat said, you really should try to avoid using two such frameworks together because they essentially do the same thing. If you're not gzipping your Javascript, you're probably sending the user at least 150-200k of JavaScript with just the libraries, nevermind the plugins you're using. Almost anything you do in MooTools can be done in jQuery and vice versa. If you look around, you can probably find scripts that do what you're looking for that have been ported both ways.

Answer 3

You can also see the use of .noConlict method of jQuery. I don't know if it'll be usefull in your case...

Answer 4

jQuery.noConflict(); 
jQuery(function($){ 

   $works with jquery here. 
});
$ works with mootools here.

However, that said, I would suggest you ditch the mootools.

Its complete modification of all object prototypes can cause cause jQuerys functions to randomly and unexplainable cause errors, and on top of that, Mootools' modification of all object prototypes ( the Object and Function prototypes are even modified ), have, in my experience, resulted in jQuery performing significantly slower than without, simply for Mootools being on the same page.

Additionally, Mootools is 50kb, jQuery is 25kb ( average numbers , including extensions ) , having them both will drastically slow down page load just for the extra data fetch.

A project I was working was having problems with javascript performance, and I'm talking really serious slowdowns, in seemingly simple code. We migrated to jQuery, and there was no performance gain until we stopped loading the mootools when we'd finished migrating the code, and then as soon as we dropped mootools, the speed came back.