[JQUERY] .live and textarea auto-resizer

Question

Hi!

I am using small plugin to jquery: jquery-plugin-autoresize

But i have trouble with using it with .live.

Does anyone know how to do it?

I tried

$('textarea .blog_comment').live('autoResize', function(e,{
// On resize:
onResize : function() {
$(this).css({opacity:0.8});
},
// After resize:
animateCallback : function() {
$(this).css({opacity:1});
},
// Quite slow animation:
animateDuration : 300,
// More extra space:
extraSpace : 40
}){});;

But it won't work. Please help. Thank you/

Answer 1

The answer to your question can be found here:

http://stackoverflow.com/questions/3456442/loading-jquery-qtip-code-dynamically/3456475#3456475

Answer 2

You either need to re-run the plugin after your elements are ready again, e.g. in the success handler of whichever AJAX method you're using, like this:

$.ajax({
   //options
   success: function(data) {
     $('textarea.blog_comment').autoresize({...plugin options...});
   }
});

Or use a plugin like .livequery(), like this:

$('textarea.blog_comment').livequery(function() {
  $(this).autoResize({
    onResize : function() {
      $(this).css({opacity:0.8});
    },
    animateCallback : function() {
      $(this).css({opacity:1});
    },
    animateDuration : 300,
    extraSpace : 40
  });
});

The short version is that .live() doesn't work for this...it's event driven, so not really suited for running most plugins.