jQuery animations

README.textile

@@ -1,5 +1,9 @@
 h3. Changelog
 
+h4. 1.7.3
+
+* Elements can have a 'show function', using jQuery fadeIn/slideDown for smoother transitions ("jimlindstrom":http://github.com/jimlindstrom)
+
 h4. 1.7.2
 
 * Submit on change if input type select and no submit button defined ("gregpyp":http://github.com/gregpyp)

default.html

@@ -29,14 +29,16 @@
     style  : "inherit",
     submitdata : function() {
       return {id : 2};
-    }
+    },
+    showfn : function (elem) { elem.fadeIn('fast'); }
   });
   $(".editable_select_json").editable("<?php print $url ?>save.php", { 
     indicator : '<img src="img/indicator.gif">',
     loadurl : "<?php print $url ?>json.php",
     type   : "select",
     submit : "OK",
-    style  : "inherit"
+    style  : "inherit",
+    showfn : function (elem) { elem.fadeIn('fast'); }
   });
   $(".editable_textarea").editable("<?php print $url ?>save.php", { 
       indicator : "<img src='img/indicator.gif'>",
@@ -45,40 +47,46 @@
       select : true,
       submit : 'OK',
       cancel : 'cancel',
-      cssclass : "editable"
+      cssclass : "editable",
+      showfn : function (elem) { elem.fadeIn('fast'); }
   });
   $(".editable_textile").editable("<?php print $url ?>save.php?renderer=textile", { 
       indicator : "<img src='img/indicator.gif'>",
       loadurl   : "<?php print $url ?>load.php",
       type      : "textarea",
       submit    : "OK",
       cancel    : "Cancel",
-      tooltip   : "Click to edit..."
+      tooltip   : "Click to edit...",
+      showfn : function (elem) { elem.fadeIn('fast'); }
   });
 
   $(".click").editable("<?php print $url ?>echo.php", { 
       indicator : "<img src='img/indicator.gif'>",
       tooltip   : "Click to edit...",
-      style  : "inherit"
+      style  : "inherit",
+      showfn : function (elem) { elem.fadeIn('fast'); }
   });
   $(".dblclick").editable("<?php print $url ?>echo.php", { 
       indicator : "<img src='img/indicator.gif'>",
       tooltip   : "Doubleclick to edit...",
       event     : "dblclick",
-      style  : "inherit"
+      style  : "inherit",
+      showfn : function (elem) { elem.fadeIn('fast'); }
   });
   $(".mouseover").editable("<?php print $url ?>echo.php", { 
       indicator : "<img src='img/indicator.gif'>",
       tooltip   : "Move mouseover to edit...",
       event     : "mouseover",
-      style  : "inherit"
+      style  : "inherit",
+      showfn : function (elem) { elem.fadeIn('fast'); }
   });
 
   /* Should not cause error. */
   $("#nosuch").editable("<?php print $url ?>echo.php", { 
       indicator : "<img src='img/indicator.gif'>",
       type   : 'textarea',
-      submit : 'OK'
+      submit : 'OK',
+      showfn : function (elem) { elem.fadeIn('fast'); }
   });
 
 });

jquery.jeditable.js

@@ -15,7 +15,7 @@
  */
 
 /**
-  * Version 1.7.2-dev
+  * Version 1.7.3-dev
   *
   * ** means there is basic unit tests for this parameter. 
   *
@@ -48,6 +48,7 @@
   * @param String  options[select]    true or false, when true text is highlighted ??
   * @param String  options[placeholder] Placeholder text or html to insert when element is empty. **
   * @param String  options[onblur]    'cancel', 'submit', 'ignore' or function ??
+  * @param Function options[showfn]   function that can animate ethe element when switching to edit mode **
   *             
   * @param Function options[onsubmit] function(settings, original) { ... } called before submit
   * @param Function options[onreset]  function(settings, original) { ... } called before reset
@@ -240,9 +241,15 @@
 
                 /* Add buttons to the form. */
                 buttons.apply(form, [settings, self]);
-         
+
                 /* Add created form to self. */
+                if (settings.showfn) {
+                    form.hide();
+                }
                 $(self).append(form);
+                if (settings.showfn) {
+                    settings.showfn(form);
+                }
 
                 /* Attach 3rd party plugin if requested. */
                 plugin.apply(form, [settings, self]);