xobs/fa20-bt
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

use 'url()'-free path when specifying parallax image, refactor so that parallax is applied to background class, remove unused attributes #595

Browse Source
This commit is contained in:
Hakim El Hattab
2013-09-15 17:45:27 -04:00
parent 36061b43ba
commit 86216ac645
6 changed files with 30 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
js/reveal.js
View File

@ -93,7 +93,7 @@ var Reveal = (function(){
backgroundTransition: 'default', // default/linear/none
// Parallax background image
parallaxBackgroundImage: '', // CSS syntax, e.g. "url('a.jpg')"
parallaxBackgroundImage: '', // CSS syntax, e.g. "a.jpg"
// Parallax background size
parallaxBackgroundSize: '', // CSS syntax, e.g. "3000px 2000px"
@ -476,24 +476,27 @@ var Reveal = (function(){
} );
// Add parallax background if specified so
var parallaxBackgroundImage = config.parallaxBackgroundImage,
parallaxBackgroundSize = config.parallaxBackgroundSize;
// Add parallax background if specified
if( config.parallaxBackgroundImage ) {
if( parallaxBackgroundImage ) {
dom.wrapper.style.background = parallaxBackgroundImage;
dom.wrapper.style.backgroundSize = parallaxBackgroundSize;
dom.background.style.backgroundImage = 'url("' + config.parallaxBackgroundImage + '")';
dom.background.style.backgroundSize = config.parallaxBackgroundSize;
// Make sure the below properties are set on the element - these properties are
// needed for proper transitions to be set on the element via CSS. To remove
// annoying background slide-in effect when the presentation starts, apply
// these properties after short time delay
setTimeout( function() {
dom.wrapper.setAttribute( 'data-parallax-background', parallaxBackgroundImage );
dom.wrapper.setAttribute( 'data-parallax-background-size', parallaxBackgroundSize );
dom.wrapper.classList.add( 'has-parallax-background' );
}, 1 );
}
else {
dom.background.style.backgroundImage = '';
dom.wrapper.classList.remove( 'has-parallax-background' );
}
}
@ -1888,13 +1891,12 @@ var Reveal = (function(){
*/
function updateParallax() {
// Animate parallax background
if( dom.wrapper.getAttribute( 'data-parallax-background' ) || config.parallaxBackgroundImage ) {
if( config.parallaxBackgroundImage ) {
var horizontalSlides = document.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ),
verticalSlides = document.querySelectorAll( VERTICAL_SLIDES_SELECTOR );
var backgroundSize = dom.wrapper.style.backgroundSize.split( ' ' ),
var backgroundSize = dom.background.style.backgroundSize.split( ' ' ),
backgroundWidth, backgroundHeight;
if( backgroundSize.length === 1 ) {
@ -1905,15 +1907,15 @@ var Reveal = (function(){
backgroundHeight = parseInt( backgroundSize[1], 10 );
}
var slideWidth = dom.wrapper.offsetWidth;
var slideWidth = dom.background.offsetWidth;
var horizontalSlideCount = horizontalSlides.length;
var horizontalOffset = -( backgroundWidth - slideWidth ) / ( horizontalSlideCount-1 ) * indexh;
var slideHeight = dom.wrapper.offsetHeight;
var slideHeight = dom.background.offsetHeight;
var verticalSlideCount = verticalSlides.length;
var verticalOffset = verticalSlideCount > 0 ? -( backgroundHeight - slideHeight ) / ( verticalSlideCount-1 ) * indexv : 0;
dom.wrapper.style.backgroundPosition = horizontalOffset + 'px ' + verticalOffset + 'px';
dom.background.style.backgroundPosition = horizontalOffset + 'px ' + verticalOffset + 'px';
}

4
js/reveal.min.js vendored
View File

File diff suppressed because one or more lines are too long