Skip to content
Permalink
Browse files

Effects (blind): direction now accepts up/down/left/right as well as …

…vertical(up) and horizontal(left) - Fixes #4480 - Invert the blind effect.
  • Loading branch information...
gnarf authored and scottgonzalez committed May 3, 2011
1 parent cbce358 commit 1f3f7bf7872db0dcfbaea0276eea93225d2a8f58
Showing with 62 additions and 19 deletions.
  1. +16 −4 tests/visual/effects.all.html
  2. +4 −2 tests/visual/effects.all.js
  3. +42 −13 ui/jquery.effects.blind.js
@@ -26,14 +26,26 @@
<ul class="effects">

<li>
<div class="effect" id="blindHorizontally">
<p>Blind horizontally</p>
<div class="effect" id="blindUp">
<p>Blind up</p>
</div>
</li>

<li>
<div class="effect" id="blindVertically">
<p>Blind vertically</p>
<div class="effect" id="blindDown">
<p>Blind down</p>
</div>
</li>

<li>
<div class="effect" id="blindLeft">
<p>Blind left</p>
</div>
</li>

<li>
<div class="effect" id="blindRight">
<p>Blind right</p>
</div>
</li>

@@ -33,8 +33,10 @@ $(function() {
})
})

effect("#blindHorizontally", "blind", { direction: "horizontal" });
effect("#blindVertically", "blind", { direction: "vertical" });
effect("#blindLeft", "blind", { direction: "left" });
effect("#blindUp", "blind", { direction: "up" });
effect("#blindRight", "blind", { direction: "right" });
effect("#blindDown", "blind", { direction: "down" });

effect("#bounce3times", "bounce", { times: 3 });

@@ -11,38 +11,67 @@
* jquery.effects.core.js
*/
(function( $, undefined ) {

var rvertical = /up|down|vertical/;
var rpositivemotion = /up|left|vertical|horizontal/;

$.effects.effect.blind = function( o ) {

return this.queue( function() {

// Create element
var el = $( this ),
props = [ 'position', 'top', 'bottom', 'left', 'right' ],
mode = $.effects.setMode( el, o.mode || 'hide' ),
direction = o.direction || 'vertical',
ref = ( direction == 'vertical' ) ? 'height' : 'width',
props = [ "position", "top", "bottom", "left", "right" ],
mode = $.effects.setMode( el, o.mode || "hide" ),
direction = o.direction || "up",
vertical = rvertical.test( direction ),
ref = vertical ? "height" : "width",
ref2 = vertical ? "top" : "left",
motion = rpositivemotion.test( direction ),
animation = {},
wrapper, distance;

$.effects.save( el, props );
el.show();
wrapper = $.effects.createWrapper( el ).css({
overflow: 'hidden'
overflow: "hidden"
});

animation[ ref ] = ( mode == 'show' ? wrapper[ ref ]() : 0 );
distance = wrapper[ ref ]();

animation[ ref ] = ( mode === "show" ? distance : 0 );
if ( !motion ) {
el
.css( vertical ? "bottom" : "right", 0 )
.css( vertical ? "top" : "left", "" )
.css({ position: "absolute" });
animation[ ref2 ] = ( mode === "show" ) ? 0 : distance;
}

// start at 0 if we are showing
( mode == 'show' && wrapper.css( ref, 0 ) );
if ( mode == "show" ) {
wrapper.css( ref, 0 );
if ( ! motion ) {
wrapper.css( ref2, distance );
}
}

// Animate
wrapper.animate( animation, o.duration, o.easing, function() {
( mode == 'hide' && el.hide() );
$.effects.restore( el, props );
$.effects.removeWrapper( el );
$.isFunction( o.complete ) && o.complete.apply( el[ 0 ], arguments );
el.dequeue();
wrapper.animate( animation, {
duration: o.duration,
easing: o.easing,
queue: false,
complete: function() {
if ( mode == "hide" ) {
el.hide();
}
$.effects.restore( el, props );
$.effects.removeWrapper( el );
if ( $.isFunction( o.complete ) ) {
o.complete.apply( el[ 0 ], arguments );
}
el.dequeue();
}
});

});

0 comments on commit 1f3f7bf

Please sign in to comment.
You can’t perform that action at this time.