Homepage and Weblog of Fleur Jeanquartier

Notes on Drupal 7 & jQuery

| 1 Comment

next to other things such as experiencing with visualizations I’m currently working to port a Drupal6 CMS module to Drupal7 (the version 7.0 was finally released on January, 6th 2011) and while I was developing some strange Javascript happenings occured.
If you would like to develop for Drupal 7 and make use of JavaScript/jQuery the following things could save you some time:

Because of the fact that jQuery and many extensions are now a direct part of the Drupal Core, in most cases the following line won’t work:
$(document).ready(function() {...}

But you can use the following snippet instead:
(function($) {...})(jQuery);

So just put a wrapper around;
Let me give you a full example:

  (function($) { // this line is necessary for drupal 7
      // the line above instead of $(document).ready(function() {...}

    $("#oldContent").hide( 'slow'); // hide container

    $('html,body').animate({ scrollTop: 
       $("#myContent").offset().top }, 
       { duration: 'slow', easing: 'swing'}
    ); //example for scrolling to a container
    //put your code in here

  })(jQuery); // this line is necessary for drupal 7

One Comment

  1. cool to see more people in austria working with drupal!

    just wanted to point you to our drupal austria community. we have monthly meetings in vienna and are always happy seeing more members around austria 🙂


Leave a Reply