r2353 - added new example for the filterCallback

r2353 - added new example for the filterCallback


Author: a.farkas.pm
Date: Sun Mar 22 08:12:31 2009
New Revision: 2353
Modified:
branches/dev/effects/tests/visual/animateClass/index.html
Log:
added new example for the filterCallback
Modified: branches/dev/effects/tests/visual/animateClass/index.html
==============================================================================
--- branches/dev/effects/tests/visual/animateClass/index.html    (original)
+++ branches/dev/effects/tests/visual/animateClass/index.html    Sun Mar 22
08:12:31 2009
@@ -154,7 +154,31 @@
                                .stop(true, true)
                                .removeClass('hover', {duration: 999});
                        });
-                    
+                        
+                    $('button.exclude')
+                        .click(function(){
+                            
+                            var dynCss = {
+                                    top: 200 * Math.random(),
+                                    left: 600 * Math.random()
+                                };
+                            $('div.exclude-filter-box')
+                                
+                                .stop(true, true)
+                                .css(dynCss)
+                                .toggleClass('exclude-filter-box-animate', {
+                                    duration: 500,
+                                    clearInlineStyles: true,
+                                    filterCallback: function(opts){
+                                        $.each(['left', 'top'], function(i, style){
+                                            if(opts.animateStyles[style]){
+                                                delete opts.animateStyles[style];
+                                            }
+                                        });
+                                        opts.resetStyle = 'top: '+ dynCss.top +'px; left: '+
dynCss.left+'px;';
+                                    }
+                                });
+                        });
                    
                    $('div.exclude-filter')
                        .click(function(){
@@ -207,7 +231,7 @@
            <input type="text" />
            <div class="inner-box"></div>
        </div>
-        

Extra Option: {filterCallback: function...}, click somewhere:


+        

Extra Option: {filterCallback: function...}, click the button or
somewhere in the box: <button class="exclude">Re-Position and
animate</button>


        <div class="exclude-filter">
            <div class="exclude-filter-box"></div>
        </div>