improve rendering accuracy of overview

This commit is contained in:
Hakim El Hattab 2012-11-23 15:48:10 -05:00
parent 8f7c51b4ec
commit 0ac4c6e585
4 changed files with 52 additions and 40 deletions

View file

@ -874,9 +874,9 @@ body {
.reveal.page .slides { .reveal.page .slides {
-webkit-perspective-origin: 0% 50%; -webkit-perspective-origin: 0% 50%;
-moz-perspective-origin: 0% 50%; -moz-perspective-origin: 0% 50%;
-ms-perspective-origin: 0% 50%; -ms-perspective-origin: 0% 50%;
perspective-origin: 0% 50%; perspective-origin: 0% 50%;
-webkit-perspective: 3000px; -webkit-perspective: 3000px;
-moz-perspective: 3000px; -moz-perspective: 3000px;
@ -1055,6 +1055,11 @@ body {
*********************************************/ *********************************************/
.reveal.overview .slides { .reveal.overview .slides {
-webkit-perspective-origin: 0% 0%;
-moz-perspective-origin: 0% 0%;
-ms-perspective-origin: 0% 0%;
perspective-origin: 0% 0%;
-webkit-perspective: 700px; -webkit-perspective: 700px;
-moz-perspective: 700px; -moz-perspective: 700px;
-ms-perspective: 700px; -ms-perspective: 700px;

2
css/reveal.min.css vendored

File diff suppressed because one or more lines are too long

View file

@ -575,53 +575,60 @@ var Reveal = (function(){
dom.wrapper.classList.add( 'overview' ); dom.wrapper.classList.add( 'overview' );
var horizontalSlides = document.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ); // Not the pretties solution, but need to let the overview
// class apply first so that slides are measured accurately
// before we can positon them
setTimeout( function(){
for( var i = 0, len1 = horizontalSlides.length; i < len1; i++ ) { var horizontalSlides = document.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR );
var hslide = horizontalSlides[i],
htransform = 'translateZ(-2500px) translate(' + ( ( i - indexh ) * 105 ) + '%, 0%)';
hslide.setAttribute( 'data-index-h', i ); for( var i = 0, len1 = horizontalSlides.length; i < len1; i++ ) {
hslide.style.display = 'block'; var hslide = horizontalSlides[i],
hslide.style.WebkitTransform = htransform; htransform = 'translateZ(-2500px) translate(' + ( ( i - indexh ) * 105 ) + '%, 0%)';
hslide.style.MozTransform = htransform;
hslide.style.msTransform = htransform;
hslide.style.OTransform = htransform;
hslide.style.transform = htransform;
if( hslide.classList.contains( 'stack' ) ) { hslide.setAttribute( 'data-index-h', i );
hslide.style.display = 'block';
hslide.style.WebkitTransform = htransform;
hslide.style.MozTransform = htransform;
hslide.style.msTransform = htransform;
hslide.style.OTransform = htransform;
hslide.style.transform = htransform;
var verticalSlides = hslide.querySelectorAll( 'section' ); if( hslide.classList.contains( 'stack' ) ) {
for( var j = 0, len2 = verticalSlides.length; j < len2; j++ ) { var verticalSlides = hslide.querySelectorAll( 'section' );
var verticalIndex = i === indexh ? indexv : getPreviousVerticalIndex( hslide );
var vslide = verticalSlides[j], for( var j = 0, len2 = verticalSlides.length; j < len2; j++ ) {
vtransform = 'translate(0%, ' + ( ( j - verticalIndex ) * 105 ) + '%)'; var verticalIndex = i === indexh ? indexv : getPreviousVerticalIndex( hslide );
vslide.setAttribute( 'data-index-h', i ); var vslide = verticalSlides[j],
vslide.setAttribute( 'data-index-v', j ); vtransform = 'translate(0%, ' + ( ( j - verticalIndex ) * 105 ) + '%)';
vslide.style.display = 'block';
vslide.style.WebkitTransform = vtransform; vslide.setAttribute( 'data-index-h', i );
vslide.style.MozTransform = vtransform; vslide.setAttribute( 'data-index-v', j );
vslide.style.msTransform = vtransform; vslide.style.display = 'block';
vslide.style.OTransform = vtransform; vslide.style.WebkitTransform = vtransform;
vslide.style.transform = vtransform; vslide.style.MozTransform = vtransform;
vslide.style.msTransform = vtransform;
vslide.style.OTransform = vtransform;
vslide.style.transform = vtransform;
// Navigate to this slide on click
vslide.addEventListener( 'click', onOverviewSlideClicked, true );
}
}
else {
// Navigate to this slide on click // Navigate to this slide on click
vslide.addEventListener( 'click', onOverviewSlideClicked, true ); hslide.addEventListener( 'click', onOverviewSlideClicked, true );
} }
} }
else {
// Navigate to this slide on click layout();
hslide.addEventListener( 'click', onOverviewSlideClicked, true );
} }, 10 );
}
layout();
} }

4
js/reveal.min.js vendored

File diff suppressed because one or more lines are too long