Using newer versions of jQuery in Drupal (6 & 7) - jQuery Multi
By Titto Jose
The Drupal 6 & 7 is shipped with jQuery library which is older than the current version that is available. Drupal 6 has version 1.2.6 and drupal 7 has 1.4.4. This offcourse can be updated to newer version using jQuery update module (Drupal 6 to jQuery 1.3.2 & Drupal 7 to jQuery 1.5.1, 1.7.1, or 1.8.2). For Drupal 7 I have seen that it causes certain minor issues (especially in Views UI) when it is set to 1.8. So the safest you can update to is 1.7 (correct me if I am wrong).
What if we need to integrate a jQuery plugin that requires newer version of jQuery? How can we do this without breaking the site?
There are many methods to achieve this. One easy solution is jQuery Multi module. jQuery Multi is a module which allow you to use another jQuery library in parallel with jQuery version supplied with Drupal or jQuery update (noConflict method).
I once had to use jQuery 1.8.3 version for integrating waypoints.js plugin for a Drupal 6 site. Here is how I did it.
First download the minified jQuery library 1.8.3 (or the newer version as required) and place it in this path "sites/all/libraries/jquery". Then install the jQuery Multi module. In it's configuration settings page the jQuery library would be detected if everything went well. Next upload the waypoints.min.js file (or the plugin you need to integrate) in libraries directory (the path should be like this "sites/all/libraries/waypoint/waypoints.min.js"). There are other methods also to include the plugin (See module's README.txt). Now on configuration settings page under libraries there appears a checkbox with label of the plugin (for me it's "waypoint", since my plugin directory is "waypoint" inside libraries directory). Check this and save the configuration. Now to use the waypoint, the code to use it need to be placed as below.
(function($){ // your code here, using jQuery 1.7.1 })(jq171)
For me I need to use jQuery 1.8.3 so my code looked like below.
(function($){ $('#container').waypoint(function (direction) { // some code }, { offset: function () { // some code } }); })(jq183);
To know other method for using newer jQuery versions see here.
Update: The latest jQuery Update module can support different jQuery version separately for administrative pages. So it is possible to set jQuery version as 1.7 for administrative page and higher version for all other pages.
The Drupal 6 & 7 is shipped with jQuery library which is older than the current version that is available. Drupal 6 has version 1.2.6 and drupal 7 has 1.4.4. This offcourse can be updated to newer version using jQuery update module (Drupal 6 to jQuery 1.3.2 & Drupal 7 to jQuery 1.5.1, 1.7.1, or 1.8.2). For Drupal 7 I have seen that it causes certain minor issues (especially in Views UI) when it is set to 1.8. So the safest you can update to is 1.7 (correct me if I am wrong).
What if we need to integrate a jQuery plugin that requires newer version of jQuery? How can we do this without breaking the site?
There are many methods to achieve this. One easy solution is jQuery Multi module. jQuery Multi is a module which allow you to use another jQuery library in parallel with jQuery version supplied with Drupal or jQuery update (noConflict method).
I once had to use jQuery 1.8.3 version for integrating waypoints.js plugin for a Drupal 6 site. Here is how I did it.
First download the minified jQuery library 1.8.3 (or the newer version as required) and place it in this path "sites/all/libraries/jquery". Then install the jQuery Multi module. In it's configuration settings page the jQuery library would be detected if everything went well. Next upload the waypoints.min.js file (or the plugin you need to integrate) in libraries directory (the path should be like this "sites/all/libraries/waypoint/waypoints.min.js"). There are other methods also to include the plugin (See module's README.txt). Now on configuration settings page under libraries there appears a checkbox with label of the plugin (for me it's "waypoint", since my plugin directory is "waypoint" inside libraries directory). Check this and save the configuration. Now to use the waypoint, the code to use it need to be placed as below.
(function($){ // your code here, using jQuery 1.7.1 })(jq171)
For me I need to use jQuery 1.8.3 so my code looked like below.
(function($){ $('#container').waypoint(function (direction) { // some code }, { offset: function () { // some code } }); })(jq183);
To know other method for using newer jQuery versions see here.
Update: The latest jQuery Update module can support different jQuery version separately for administrative pages. So it is possible to set jQuery version as 1.7 for administrative page and higher version for all other pages.
