Advanced Search

JQuery: package stuff into a plugin

/ Published in: jQuery
Save to your folder(s)
the plugin model in JQuery takes advantage of JavaScript’s prototype inheritance and makes it trivially easy to add new chainable methods

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. jQuery('div#message').addClass(
  2. 	'borderfade'
  3. ).animate({
  4.    'borderWidth': '+10px'
  5. }, 1000).fadeOut();
  6.  
  7.  
  8. // Can be 'packaged' as:
  9.  
  10. jQuery.fn.dumbBorderFade = function() {
  11.     return this.addClass(
  12.         'borderfade'
  13.     ).animate({
  14.        'borderWidth': '+10px'
  15.     }, 1000).fadeOut();
  16. };
  17.  
  18. // Now we can apply it to an element like so:
  19.  
  20. jQuery('div#message').dumbBorderFade();

Report this snippet


Comments

You need to login to view comments.