fix animations intermittently not triggering in firefox
							parent
							
								
									c38bc2c611
								
							
						
					
					
						commit
						f263f2819d
					
				
							
								
								
									
										39
									
								
								js/reveal.js
								
								
								
								
							
							
						
						
									
										39
									
								
								js/reveal.js
								
								
								
								
							|  | @ -3852,20 +3852,22 @@ | ||||||
| 	 */ | 	 */ | ||||||
| 	function autoAnimate( fromSlide, toSlide ) { | 	function autoAnimate( fromSlide, toSlide ) { | ||||||
| 
 | 
 | ||||||
| 		// Remove any existing auto-animate sheet. Recycling led to
 | 		// Clean up after prior animations
 | ||||||
| 		// animations sometimes not trigger in FF.
 | 		removeEphemeralAutoAnimateAttributes(); | ||||||
|  | 
 | ||||||
| 		if( autoAnimateStyleSheet && autoAnimateStyleSheet.parentNode ) { | 		if( autoAnimateStyleSheet && autoAnimateStyleSheet.parentNode ) { | ||||||
| 			autoAnimateStyleSheet.parentNode.removeChild( autoAnimateStyleSheet ); | 			autoAnimateStyleSheet.parentNode.removeChild( autoAnimateStyleSheet ); | ||||||
| 			autoAnimateStyleSheet = null; | 			autoAnimateStyleSheet = null; | ||||||
| 		} | 		} | ||||||
| 
 | 
 | ||||||
| 		// Create a new auto-animate sheet
 | 		// Ensure that both slides are auto-animate targets
 | ||||||
| 		autoAnimateStyleSheet = document.createElement( 'style' ); | 		if( fromSlide.hasAttribute( 'data-auto-animate' ) && toSlide.hasAttribute( 'data-auto-animate' ) ) { | ||||||
| 		autoAnimateStyleSheet.type = 'text/css'; |  | ||||||
| 		document.head.appendChild( autoAnimateStyleSheet ); |  | ||||||
| 
 | 
 | ||||||
| 		// Clean up after prior animations
 | 			// Create a new auto-animate sheet
 | ||||||
| 		removeEphemeralAutoAnimateAttributes(); | 			autoAnimateStyleSheet = autoAnimateStyleSheet || document.createElement( 'style' ); | ||||||
|  | 			autoAnimateStyleSheet.type = 'text/css'; | ||||||
|  | 			autoAnimateStyleSheet.className = 'auto-animate-styes'; | ||||||
|  | 			document.head.appendChild( autoAnimateStyleSheet ); | ||||||
| 
 | 
 | ||||||
| 			var slideOptions = getAutoAnimateOptions( toSlide, { | 			var slideOptions = getAutoAnimateOptions( toSlide, { | ||||||
| 
 | 
 | ||||||
|  | @ -3876,11 +3878,9 @@ | ||||||
| 
 | 
 | ||||||
| 			} ); | 			} ); | ||||||
| 
 | 
 | ||||||
| 		// Set our starting state. Note that we may be coming from, or
 | 			// Set our starting state
 | ||||||
| 		// going to, a non-auto-animate slide so we only want to assign
 | 			fromSlide.dataset.autoAnimate = 'pending'; | ||||||
| 		// this value is the attribute exists.
 | 			toSlide.dataset.autoAnimate = 'pending'; | ||||||
| 		if( typeof fromSlide.dataset.autoAnimate === 'string' ) fromSlide.dataset.autoAnimate = 'pending'; |  | ||||||
| 		if( typeof toSlide.dataset.autoAnimate === 'string' ) toSlide.dataset.autoAnimate = 'pending'; |  | ||||||
| 
 | 
 | ||||||
| 			// Inject our auto-animate styles for this transition
 | 			// Inject our auto-animate styles for this transition
 | ||||||
| 			var css = getAutoAnimatableElements( fromSlide, toSlide ).map( function( elements ) { | 			var css = getAutoAnimatableElements( fromSlide, toSlide ).map( function( elements ) { | ||||||
|  | @ -3903,9 +3903,14 @@ | ||||||
| 			autoAnimateStyleSheet.innerHTML = css.join( '' ); | 			autoAnimateStyleSheet.innerHTML = css.join( '' ); | ||||||
| 
 | 
 | ||||||
| 			// Start the animation next cycle
 | 			// Start the animation next cycle
 | ||||||
| 		setTimeout( function() { | 			requestAnimationFrame( function() { | ||||||
| 			if( typeof toSlide.dataset.autoAnimate === 'string' ) toSlide.dataset.autoAnimate = 'running'; | 				// This forces our newly injected styles to be applied in Firefox
 | ||||||
| 		}, 2 ); | 				getComputedStyle( autoAnimateStyleSheet ).fontWeight; | ||||||
|  | 
 | ||||||
|  | 				toSlide.dataset.autoAnimate = 'running'; | ||||||
|  | 			} ); | ||||||
|  | 
 | ||||||
|  | 		} | ||||||
| 
 | 
 | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
|  | @ -4076,7 +4081,7 @@ | ||||||
| 			properties.height = element.offsetHeight; | 			properties.height = element.offsetHeight; | ||||||
| 		} | 		} | ||||||
| 
 | 
 | ||||||
| 		var computedStyles = window.getComputedStyle( element ); | 		var computedStyles = getComputedStyle( element ); | ||||||
| 
 | 
 | ||||||
| 		// CSS styles
 | 		// CSS styles
 | ||||||
| 		( elementOptions.styles || config.autoAnimateStyles ).forEach( function( style ) { | 		( elementOptions.styles || config.autoAnimateStyles ).forEach( function( style ) { | ||||||
|  |  | ||||||
		Loading…
	
		Reference in New Issue
	
	 Hakim El Hattab
						Hakim El Hattab