lazy load all slide backgrounds
This commit is contained in:
parent
0140a15bae
commit
7158c12eff
@ -1337,6 +1337,7 @@ body {
|
|||||||
perspective: 600px;
|
perspective: 600px;
|
||||||
}
|
}
|
||||||
.reveal .slide-background {
|
.reveal .slide-background {
|
||||||
|
display: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -1352,6 +1353,11 @@ body {
|
|||||||
-moz-transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
|
-moz-transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
|
||||||
transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
|
transition: all 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.reveal .slide-background.stack {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
.reveal .slide-background.present {
|
.reveal .slide-background.present {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
|
17
js/reveal.js
17
js/reveal.js
@ -528,6 +528,8 @@ var Reveal = (function(){
|
|||||||
createBackground( slidev, backgroundStack );
|
createBackground( slidev, backgroundStack );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
backgroundStack.classList.add( 'stack' );
|
||||||
|
|
||||||
} );
|
} );
|
||||||
|
|
||||||
} );
|
} );
|
||||||
@ -2279,8 +2281,14 @@ var Reveal = (function(){
|
|||||||
*/
|
*/
|
||||||
function showSlide( slide ) {
|
function showSlide( slide ) {
|
||||||
|
|
||||||
|
// Show the slide element
|
||||||
slide.style.display = 'block';
|
slide.style.display = 'block';
|
||||||
|
|
||||||
|
// Show the corresponding background element
|
||||||
|
var indices = getIndices( slide );
|
||||||
|
var background = getSlideBackground( indices.h, indices.v );
|
||||||
|
background.style.display = 'block';
|
||||||
|
|
||||||
// Media elements with data-src attributes
|
// Media elements with data-src attributes
|
||||||
toArray( slide.querySelectorAll( 'img[data-src], video[data-src], audio[data-src], iframe[data-src]' ) ).forEach( function( element ) {
|
toArray( slide.querySelectorAll( 'img[data-src], video[data-src], audio[data-src], iframe[data-src]' ) ).forEach( function( element ) {
|
||||||
element.setAttribute( 'src', element.getAttribute( 'data-src' ) );
|
element.setAttribute( 'src', element.getAttribute( 'data-src' ) );
|
||||||
@ -2312,8 +2320,14 @@ var Reveal = (function(){
|
|||||||
*/
|
*/
|
||||||
function hideSlide( slide ) {
|
function hideSlide( slide ) {
|
||||||
|
|
||||||
|
// Hide the slide element
|
||||||
slide.style.display = 'none';
|
slide.style.display = 'none';
|
||||||
|
|
||||||
|
// Hide the corresponding background element
|
||||||
|
var indices = getIndices( slide );
|
||||||
|
var background = getSlideBackground( indices.h, indices.v );
|
||||||
|
background.style.display = 'none';
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -2618,6 +2632,9 @@ var Reveal = (function(){
|
|||||||
// Now that we know which the horizontal slide is, get its index
|
// Now that we know which the horizontal slide is, get its index
|
||||||
h = Math.max( horizontalSlides.indexOf( slideh ), 0 );
|
h = Math.max( horizontalSlides.indexOf( slideh ), 0 );
|
||||||
|
|
||||||
|
// Assume we're not vertical
|
||||||
|
v = 0;
|
||||||
|
|
||||||
// If this is a vertical slide, grab the vertical index
|
// If this is a vertical slide, grab the vertical index
|
||||||
if( isVertical ) {
|
if( isVertical ) {
|
||||||
v = Math.max( toArray( slide.parentNode.querySelectorAll( 'section' ) ).indexOf( slide ), 0 );
|
v = Math.max( toArray( slide.parentNode.querySelectorAll( 'section' ) ).indexOf( slide ), 0 );
|
||||||
|
@ -101,6 +101,8 @@ Reveal.addEventListener( 'ready', function() {
|
|||||||
strictEqual( Reveal.getIndices().v, 2, 'v 2' );
|
strictEqual( Reveal.getIndices().v, 2, 'v 2' );
|
||||||
|
|
||||||
Reveal.slide( 0, 0 );
|
Reveal.slide( 0, 0 );
|
||||||
|
strictEqual( Reveal.getIndices().h, 0, 'h 0' );
|
||||||
|
strictEqual( Reveal.getIndices().v, 0, 'v 0' );
|
||||||
});
|
});
|
||||||
|
|
||||||
test( 'Reveal.getSlide', function() {
|
test( 'Reveal.getSlide', function() {
|
||||||
|
Loading…
Reference in New Issue
Block a user