diff options
author | gnarf <gnarf@gnarf.net> | 2011-03-06 15:24:24 -0600 |
---|---|---|
committer | gnarf <gnarf@gnarf.net> | 2011-03-06 15:24:24 -0600 |
commit | bcb8f7ed9aee8ecb0ad5144204f6c7083949b3a7 (patch) | |
tree | f73ea5048f9f912c202493b323ae0db7d5f58a77 /ui/jquery.effects.explode.js | |
parent | 61cf83408136514282523179e4ce93d3b88638da (diff) | |
download | jquery-ui-bcb8f7ed9aee8ecb0ad5144204f6c7083949b3a7.tar.gz jquery-ui-bcb8f7ed9aee8ecb0ad5144204f6c7083949b3a7.zip |
effects.*: More Style Guidance
Diffstat (limited to 'ui/jquery.effects.explode.js')
-rw-r--r-- | ui/jquery.effects.explode.js | 99 |
1 files changed, 49 insertions, 50 deletions
diff --git a/ui/jquery.effects.explode.js b/ui/jquery.effects.explode.js index 7dffed5ed..763092457 100644 --- a/ui/jquery.effects.explode.js +++ b/ui/jquery.effects.explode.js @@ -12,64 +12,63 @@ */ (function( $, undefined ) { -$.effects.explode = function(o) { +$.effects.explode = function( o ) { - return this.queue(function() { + return this.queue( function() { - var rows = o.pieces ? Math.round(Math.sqrt(o.pieces)) : 3; - var cells = o.pieces ? Math.round(Math.sqrt(o.pieces)) : 3; + var rows = o.pieces ? Math.round(Math.sqrt(o.pieces)) : 3, + cells = rows, + el = $( this ).show().css( 'visibility', 'hidden' ), + mode = $.effects.setMode( el, o.mode || 'hide' ), + offset = el.offset(), + width = el.outerWidth( true ), + height = el.outerHeight( true ); - o.mode = o.mode == 'toggle' ? ($(this).is(':visible') ? 'hide' : 'show') : o.mode; - var el = $(this).show().css('visibility', 'hidden'); - var offset = el.offset(); + //Substract the margins - not fixing the problem yet. + offset.top -= parseInt( el.css( "marginTop" ), 10 ) || 0; + offset.left -= parseInt( el.css( "marginLeft" ), 10 ) || 0; - //Substract the margins - not fixing the problem yet. - offset.top -= parseInt(el.css("marginTop"),10) || 0; - offset.left -= parseInt(el.css("marginLeft"),10) || 0; - - var width = el.outerWidth(true); - var height = el.outerHeight(true); - - for(var i=0;i<rows;i++) { // = - for(var j=0;j<cells;j++) { // || - el - .clone() - .appendTo('body') - .wrap('<div></div>') - .css({ - position: 'absolute', - visibility: 'visible', - left: -j*(width/cells), - top: -i*(height/rows) - }) - .parent() - .addClass('ui-effects-explode') - .css({ - position: 'absolute', - overflow: 'hidden', - width: width/cells, - height: height/rows, - left: offset.left + j*(width/cells) + (o.mode == 'show' ? (j-Math.floor(cells/2))*(width/cells) : 0), - top: offset.top + i*(height/rows) + (o.mode == 'show' ? (i-Math.floor(rows/2))*(height/rows) : 0), - opacity: o.mode == 'show' ? 0 : 1 - }).animate({ - left: offset.left + j*(width/cells) + (o.mode == 'show' ? 0 : (j-Math.floor(cells/2))*(width/cells)), - top: offset.top + i*(height/rows) + (o.mode == 'show' ? 0 : (i-Math.floor(rows/2))*(height/rows)), - opacity: o.mode == 'show' ? 1 : 0 - }, o.duration || 500); + for( var i = 0; i < rows ; i++ ) { // = + for( var j = 0; j < cells ; j++ ) { // || + el + .clone() + .appendTo('body') + .wrap('<div></div>') + .css({ + position: 'absolute', + visibility: 'visible', + left: -j*(width/cells), + top: -i*(height/rows) + }) + .parent() + .addClass('ui-effects-explode') + .css({ + position: 'absolute', + overflow: 'hidden', + width: width/cells, + height: height/rows, + left: offset.left + j*(width/cells) + (o.mode == 'show' ? (j-Math.floor(cells/2))*(width/cells) : 0), + top: offset.top + i*(height/rows) + (o.mode == 'show' ? (i-Math.floor(rows/2))*(height/rows) : 0), + opacity: mode == 'show' ? 0 : 1 + }).animate({ + left: offset.left + j*(width/cells) + (o.mode == 'show' ? 0 : (j-Math.floor(cells/2))*(width/cells)), + top: offset.top + i*(height/rows) + (o.mode == 'show' ? 0 : (i-Math.floor(rows/2))*(height/rows)), + opacity: mode == 'show' ? 1 : 0 + }, o.duration || 500); + } } - } - - // Set a timeout, to call the callback approx. when the other animations have finished - setTimeout(function() { - o.mode == 'show' ? el.css({ visibility: 'visible' }) : el.css({ visibility: 'visible' }).hide(); - if(o.complete) o.complete.apply(el[0]); // Callback - el.dequeue(); + // Set a timeout, to call the callback approx. when the other animations have finished + setTimeout(function() { - $('div.ui-effects-explode').remove(); + el.css({ visibility: 'visible' }); + mode != 'show' && el.hide(); + $.isFunction( o.complete ) && o.complete.apply( el[ 0 ] ); + el.dequeue(); - }, o.duration || 500); + // Note: This is removing all exploding peices from the dom, rather than the ones for this animation only... Ticket# 6022 + $('div.ui-effects-explode').remove(); + }, o.duration || 500); }); |