mirror of
https://github.com/jquery/jquery.git
synced 2024-11-23 02:54:22 +00:00
Effects: Improve raf logic
* Make animation behave as if jQuery.fx.off = true if document is hidden
* Use cancelAnimationFrame in jQuery.fx.stop
Ref 708764f47b
This commit is contained in:
parent
06a4540696
commit
9dc29a2b13
42
src/effects.js
vendored
42
src/effects.js
vendored
@ -78,11 +78,6 @@ function raf() {
|
||||
}
|
||||
}
|
||||
|
||||
// Will get false negative for old browsers which is okay
|
||||
function isDocumentHidden() {
|
||||
return "hidden" in document && document.hidden;
|
||||
}
|
||||
|
||||
// Animations created synchronously will run synchronously
|
||||
function createFxNow() {
|
||||
setTimeout(function() {
|
||||
@ -446,8 +441,15 @@ jQuery.speed = function( speed, easing, fn ) {
|
||||
easing: fn && easing || easing && !jQuery.isFunction( easing ) && easing
|
||||
};
|
||||
|
||||
opt.duration = jQuery.fx.off ? 0 : typeof opt.duration === "number" ? opt.duration :
|
||||
opt.duration in jQuery.fx.speeds ? jQuery.fx.speeds[ opt.duration ] : jQuery.fx.speeds._default;
|
||||
// Go to the end state if fx are off or if document is hidden
|
||||
if ( jQuery.fx.off || document.hidden ) {
|
||||
opt.duration = 0;
|
||||
|
||||
} else {
|
||||
opt.duration = typeof opt.duration === "number" ?
|
||||
opt.duration : opt.duration in jQuery.fx.speeds ?
|
||||
jQuery.fx.speeds[ opt.duration ] : jQuery.fx.speeds._default;
|
||||
}
|
||||
|
||||
// normalize opt.queue - true/undefined/null -> "fx"
|
||||
if ( opt.queue == null || opt.queue === true ) {
|
||||
@ -472,10 +474,6 @@ jQuery.speed = function( speed, easing, fn ) {
|
||||
|
||||
jQuery.fn.extend({
|
||||
fadeTo: function( speed, to, easing, callback ) {
|
||||
if ( isDocumentHidden() ) {
|
||||
return this;
|
||||
}
|
||||
|
||||
// show any hidden elements after setting opacity to 0
|
||||
return this.filter( isHidden ).css( "opacity", 0 ).show()
|
||||
|
||||
@ -483,10 +481,6 @@ jQuery.fn.extend({
|
||||
.end().animate({ opacity: to }, speed, easing, callback );
|
||||
},
|
||||
animate: function( prop, speed, easing, callback ) {
|
||||
if ( isDocumentHidden() ) {
|
||||
return this;
|
||||
}
|
||||
|
||||
var empty = jQuery.isEmptyObject( prop ),
|
||||
optall = jQuery.speed( speed, easing, callback ),
|
||||
doAnimation = function() {
|
||||
@ -654,18 +648,18 @@ jQuery.fx.timer = function( timer ) {
|
||||
jQuery.fx.interval = 13;
|
||||
|
||||
jQuery.fx.start = function() {
|
||||
if ( !timerId ) {
|
||||
if ( window.requestAnimationFrame ) {
|
||||
timerId = true;
|
||||
window.requestAnimationFrame( raf );
|
||||
} else {
|
||||
timerId = setInterval( jQuery.fx.tick, jQuery.fx.interval );
|
||||
}
|
||||
}
|
||||
timerId = window.requestAnimationFrame ?
|
||||
window.requestAnimationFrame( raf ) :
|
||||
setInterval( jQuery.fx.tick, jQuery.fx.interval );
|
||||
};
|
||||
|
||||
jQuery.fx.stop = function() {
|
||||
clearInterval( timerId );
|
||||
if ( window.cancelAnimationFrame ) {
|
||||
window.cancelAnimationFrame( timerId );
|
||||
} else {
|
||||
clearInterval( timerId );
|
||||
}
|
||||
|
||||
timerId = null;
|
||||
};
|
||||
|
||||
|
28
test/unit/effects.js
vendored
28
test/unit/effects.js
vendored
@ -2239,4 +2239,32 @@ test( "Respect display value on inline elements (#14824)", 2, function() {
|
||||
clock.tick( 800 );
|
||||
});
|
||||
|
||||
test( "Animation should go to its end state if document.hidden = true", 1, function() {
|
||||
var height;
|
||||
if ( Object.defineProperty ) {
|
||||
|
||||
// Can't rewrite document.hidden property if its host property
|
||||
try {
|
||||
Object.defineProperty( document, "hidden", {
|
||||
get: function() {
|
||||
return true;
|
||||
}
|
||||
});
|
||||
} catch ( e ) {}
|
||||
} else {
|
||||
document.hidden = true;
|
||||
}
|
||||
|
||||
if ( document.hidden ) {
|
||||
height = jQuery( "#qunit-fixture" ).animate({ height: 500 } ).height();
|
||||
|
||||
equal( height, 500, "Animation should happen immediately if document.hidden = true" );
|
||||
jQuery( document ).removeProp( "hidden" );
|
||||
|
||||
} else {
|
||||
ok( true, "Can't run the test since we can't reproduce correct environment for it" );
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
})();
|
||||
|
Loading…
Reference in New Issue
Block a user