From 544e090bd12b79ae48c8daa8c1d267d4a83d4f19 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 4 Jun 2013 20:25:47 +0200 Subject: allow control over background color when using images (#453) --- js/reveal.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) (limited to 'js/reveal.js') diff --git a/js/reveal.js b/js/reveal.js index 3d6e2da..5ac219e 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -249,7 +249,8 @@ var Reveal = (function(){ /** * Creates the slide background elements and appends them - * to the background container. + * to the background container. One element is created per + * slide no matter if the given slide has visible background. */ function createBackgrounds() { @@ -264,6 +265,7 @@ var Reveal = (function(){ var data = { background: slide.getAttribute( 'data-background' ), backgroundSize: slide.getAttribute( 'data-background-size' ), + backgroundColor: slide.getAttribute( 'data-background-color' ), backgroundRepeat: slide.getAttribute( 'data-background-repeat' ), backgroundPosition: slide.getAttribute( 'data-background-position' ) }; @@ -272,7 +274,7 @@ var Reveal = (function(){ if( data.background ) { // Auto-wrap image urls in url(...) - if( /\.(png|jpg|jpeg|gif|bmp|)$/gi.test( data.background ) ) { + if( /\.(png|jpg|jpeg|gif|bmp)$/gi.test( data.background ) ) { element.style.backgroundImage = 'url('+ data.background +')'; } else { @@ -282,6 +284,7 @@ var Reveal = (function(){ // Additional and optional background properties if( data.backgroundSize ) element.style.backgroundSize = data.backgroundSize; + if( data.backgroundColor ) element.style.backgroundColor = data.backgroundColor; if( data.backgroundRepeat ) element.style.backgroundRepeat = data.backgroundRepeat; if( data.backgroundPosition ) element.style.backgroundPosition = data.backgroundPosition; -- cgit v1.2.3