add util method for applying css transforms
This commit is contained in:
parent
b17e285164
commit
6c0dc635a1
49
js/reveal.js
49
js/reveal.js
|
@ -664,6 +664,19 @@ var Reveal = (function(){
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Applies a CSS transform to the target element.
|
||||||
|
*/
|
||||||
|
function transformElement( element, transform ) {
|
||||||
|
|
||||||
|
element.style.WebkitTransform = transform;
|
||||||
|
element.style.MozTransform = transform;
|
||||||
|
element.style.msTransform = transform;
|
||||||
|
element.style.OTransform = transform;
|
||||||
|
element.style.transform = transform;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Retrieves the height of the given element by looking
|
* Retrieves the height of the given element by looking
|
||||||
* at the position and height of its immediate children.
|
* at the position and height of its immediate children.
|
||||||
|
@ -949,13 +962,7 @@ var Reveal = (function(){
|
||||||
}
|
}
|
||||||
// Apply scale transform as a fallback
|
// Apply scale transform as a fallback
|
||||||
else {
|
else {
|
||||||
var transform = 'translate(-50%, -50%) scale('+ scale +') translate(50%, 50%)';
|
transformElement( dom.slides, 'translate(-50%, -50%) scale('+ scale +') translate(50%, 50%)' );
|
||||||
|
|
||||||
dom.slides.style.WebkitTransform = transform;
|
|
||||||
dom.slides.style.MozTransform = transform;
|
|
||||||
dom.slides.style.msTransform = transform;
|
|
||||||
dom.slides.style.OTransform = transform;
|
|
||||||
dom.slides.style.transform = transform;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Select all slides, vertical and horizontal
|
// Select all slides, vertical and horizontal
|
||||||
|
@ -1062,15 +1069,12 @@ var Reveal = (function(){
|
||||||
|
|
||||||
for( var i = 0, len1 = horizontalSlides.length; i < len1; i++ ) {
|
for( var i = 0, len1 = horizontalSlides.length; i < len1; i++ ) {
|
||||||
var hslide = horizontalSlides[i],
|
var hslide = horizontalSlides[i],
|
||||||
hoffset = config.rtl ? -105 : 105,
|
hoffset = config.rtl ? -105 : 105;
|
||||||
htransform = 'translateZ(-'+ depth +'px) translate(' + ( ( i - indexh ) * hoffset ) + '%, 0%)';
|
|
||||||
|
|
||||||
hslide.setAttribute( 'data-index-h', i );
|
hslide.setAttribute( 'data-index-h', i );
|
||||||
hslide.style.WebkitTransform = htransform;
|
|
||||||
hslide.style.MozTransform = htransform;
|
// Apply CSS transform
|
||||||
hslide.style.msTransform = htransform;
|
transformElement( hslide, 'translateZ(-'+ depth +'px) translate(' + ( ( i - indexh ) * hoffset ) + '%, 0%)' );
|
||||||
hslide.style.OTransform = htransform;
|
|
||||||
hslide.style.transform = htransform;
|
|
||||||
|
|
||||||
if( hslide.classList.contains( 'stack' ) ) {
|
if( hslide.classList.contains( 'stack' ) ) {
|
||||||
|
|
||||||
|
@ -1079,16 +1083,13 @@ var Reveal = (function(){
|
||||||
for( var j = 0, len2 = verticalSlides.length; j < len2; j++ ) {
|
for( var j = 0, len2 = verticalSlides.length; j < len2; j++ ) {
|
||||||
var verticalIndex = i === indexh ? indexv : getPreviousVerticalIndex( hslide );
|
var verticalIndex = i === indexh ? indexv : getPreviousVerticalIndex( hslide );
|
||||||
|
|
||||||
var vslide = verticalSlides[j],
|
var vslide = verticalSlides[j];
|
||||||
vtransform = 'translate(0%, ' + ( ( j - verticalIndex ) * 105 ) + '%)';
|
|
||||||
|
|
||||||
vslide.setAttribute( 'data-index-h', i );
|
vslide.setAttribute( 'data-index-h', i );
|
||||||
vslide.setAttribute( 'data-index-v', j );
|
vslide.setAttribute( 'data-index-v', j );
|
||||||
vslide.style.WebkitTransform = vtransform;
|
|
||||||
vslide.style.MozTransform = vtransform;
|
// Apply CSS transform
|
||||||
vslide.style.msTransform = vtransform;
|
transformElement( vslide, 'translate(0%, ' + ( ( j - verticalIndex ) * 105 ) + '%)' );
|
||||||
vslide.style.OTransform = vtransform;
|
|
||||||
vslide.style.transform = vtransform;
|
|
||||||
|
|
||||||
// Navigate to this slide on click
|
// Navigate to this slide on click
|
||||||
vslide.addEventListener( 'click', onOverviewSlideClicked, true );
|
vslide.addEventListener( 'click', onOverviewSlideClicked, true );
|
||||||
|
@ -1154,11 +1155,7 @@ var Reveal = (function(){
|
||||||
element.style.display = '';
|
element.style.display = '';
|
||||||
|
|
||||||
// Resets all transforms to use the external styles
|
// Resets all transforms to use the external styles
|
||||||
element.style.WebkitTransform = '';
|
transformElement( element, '' );
|
||||||
element.style.MozTransform = '';
|
|
||||||
element.style.msTransform = '';
|
|
||||||
element.style.OTransform = '';
|
|
||||||
element.style.transform = '';
|
|
||||||
|
|
||||||
element.removeEventListener( 'click', onOverviewSlideClicked, true );
|
element.removeEventListener( 'click', onOverviewSlideClicked, true );
|
||||||
}
|
}
|
||||||
|
|
4
js/reveal.min.js
vendored
4
js/reveal.min.js
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user