execute function when certain slide appear in reveal.js

Question

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 som

Answer 1

This can be achieved by using reveal.js states (https://github.com/hakimel/reveal.js#states).

1) Add a unique state to the section that should trigger your method.

<section data-state="stats">
    <h2>This will trigger a state event with the name "stats".</h2>
</section>

2) Add a listener to your custom state using the reveal.js API.

Reveal.addEventListener( 'stats', function() {
    // Called each time the slide with the "stats" state is made visible
} );

Complete working example: https://gist.github.com/hakimel/cea4305a33713d4a5a7e

Answer 2

To answer Philippe Leefsma's question: you can use bind() to pass arguments, like so:

drawDiagramOnSlide.bind(
    null,
    slideName,
    slideEl.querySelector('.diagram')
));

Assuming drawDiagramOnSlide looks like this:

function drawDiagramOnSlide(_slideName, _diagramEl, _event) {...}

The bind call will create a function that calls drawDiagramOnSlide with the correct slide name and element (in my case, a div with class diagram inside the slide ).