javascript - Need help Converting a jQuery event to a Drupal Behavior -

i have drupal 7 web site using jquery animations fadein div tags. need event capture fadein when completed. have found sample jquery example need to, have not been able convert drupal 7 behavior , i'm not quite sure might missing.

fiddle example

below drupal js file, fadeinevent.js.

drupal.behaviors.fadeinevent= {     attach: function (context, settings) {          var _old = jquery.fn.fadein;          jquery.fn.fadein = function() {             var self = this;             _old.apply(this.arguments).promise().done(function(){                 self.trigger('fadein');             });         };          jquery('.tab-pane').bind('fadein', function() {              alert('fadein done.');         });      } }; 

in above js code, never alert fadein has finished on item have selected.

firs of all, while using jquery in noconflict mode, may use closure access $

(function($) {     // jquery code using $ object. }(jquery)); 

regarding .fadein(), consider snippet:

/**   * $.fn.fadeinnew plugin triggering 'fadeindone', when .fadein done.   *   * @param speed   * @param easing   * @param callback   * @returns {$.fn}   */  $.fn.fadeinnew = function(speed, easing, callback) {      var self = this;      self.animate({      opacity: "show"    }, speed, easing, function() {      self.trigger('fadeindone');        if ($.isfunction(callback)) {        callback.apply(self);      }    });      return self;  }    $('.tab-pane').on('fadeindone', function() {    alert('alarm!');  });    $('.button').on('click', function(e) {    $('.tab-pane').fadeinnew();  });

.tab-pane {    display: none;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div class="tab-pane">have day!</div>  <button class="button">show something!</button>

since don't idea of overriding native methods of libraries, have made plugin .fadeinnew(), trigger custom fadeindone event on element. code behind animation almoast same in native implementation see source here.

also, don't need use drupal.behaviors define that. should use attach things being loaded drupal's ajax framework, see includes/ajax.php