reveal.js

I've been working with reveal.js a bit and you can change the background of individual slides with something referred to as the global state as seen here in the demo. Are there other colors besides the ones mention (-soothe, -blackout and -alert) on this slide that can be applied (hit down key in the presentation to see the colors)? If so what colors? jplindstrom You can do this to e.g. have a different background color for the final slide: Declare a style for the background (given the class "the-end"): html.the-end .state-background { background-color: rgba(0,0,0, 0.8); } Then have the final

I want to have a background image on the right hand side of one slide in a reveal.js presentation. I added the image to the slide like this: <section data-background="myImage.jpg"> // content </section> How can I add css styles to make it appear on the right edge of the screen? This article helped to find the solution . You can add a style to the html element for the current section using data-state="something" and of course you can use that style for tweaking your css. So I used this html: <section data-background="myImage.jpg" data-state="img-right"> // content </section> and the following

I create a presentation with this javascript framework http://lab.hakim.se/reveal-js/#/ and when certain slide is appearing I want to execute function stats(), which display some data from API every 5 seconds, but only when this slide is appearing function stats(){ $.ajax({ type: "GET", url: url_survey, dataType: "json", success : function (data) { //some code to display data }, error: //some code }); } in HTML file I have this: <section> <div id="stats"> </div> </section> how can I do it? I wrote this code, but it works always, not only when slide appear function check(){ if($("#stats").is("

Is it possible to add/remove slides while a presentation is running with reveal.js? To be precise, is there an API for that or maybe some dirty workaround? I was curious about this as well for an upcoming project; looked around and couldn't find anything so I wrote something for my own project, appended at the end. Adding a slide after your current slide is pretty straightforward. Just append a section element to '.slides', and make sure the section has class 'future'. Also, if you are on the last slide, you need to add class 'enabled' to '.navigate-right'. Adding something before the current

I would like to style my reveal.js very first (title) slide slightly differently than my other slides. How could I create a separate section environment for "title" slides with: All headings and text centered? All contents vertically aligned in the middle? My default (content) slides should be left-aligned and not vertically centered. This means that in the init part Reveal.initialize({... center: false, ...}) And for my custom theme.css , all headings and paragraph text are left-aligned with text-align: left . I was hoping there would be some <section data-center=true> override option, but

I am trying to access the styles of the background-image in reveal.js for three reasons: a) I'd like to override the background image in the overviewmode b) I'd like to blur some backgrounds with CSS I found two articles on SO that helped me: a) How to position a background image in reveal.js? b) reveal.js background color choices But I must be missing something, so I created this jsFiddle to demonstrate the problem: http://jsfiddle.net/dirkk0/asya4grv/ html.thisState .state-background { /* background image is NOT changed, but the backgroundcolor changes */ background-color: rgba(0, 0, 0, 0.8)