Reveal JS Trial

To replace Flowtime js

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.2.0/css/reveal.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/headjs/1.0.3/head.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.2.0/js/reveal.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.2.0/css/theme/moon.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.2.0/lib/css/zenburn.min.css">
<div class="reveal">
    <div class="slides">
        <section data-transition="convex">
            <h2>Example code</h2><h3>with no line numbers</h3>
            <pre><code class="php">
/**
 * Example Code.
 */
function my_example_code($line_numbers = TRUE) {
  $message = 'This example code does';
  $message .= ($line_numbers ? '' : ' not');
  $message .= ' have line numbers.';

  return $message;
}

print my_example_code(FALSE);
            </code></pre>
        </section>
        <section data-markdown>
            <script type="text/template">
                ## Testing Markdown Options This "slide" should contain 'smart' quotes. [link](sss)
            </script>
        </section>

        <section>

            <section>Vertical Slide 1</section>
            <section>Vertical Slide 2</section>
        </section>
        <section>
            <section>S2 - Vertical Slide 1</section>
            <section>S2 - Vertical Slide 2</section>
        </section>
    </div>
</div>

JavaScript

Reveal.initialize({
    slideNumber: 'c/t',
    dependencies: [
    {
                        src: 'bower_components/reveal.js/lib/js/classList.js',
                        condition: function() { return !document.body.classList; }
                    },
    {
            src: 'https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.2.0/plugin/markdown/marked.min.js',
            condition: function() {
                return !!document.querySelector('[data-markdown]');
            }
        },
        {
            src: 'https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.2.0/plugin/markdown/markdown.js',
            condition: function() {
                return !!document.querySelector('[data-markdown]');
            }
        },

        // Syntax highlight for <code> elements
        {
            src: 'https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.2.0/plugin/highlight/highlight.js',
            async: true,
            condition: function() {
                return !!document.querySelector('pre code');
            },
            callback: function() {
                hljs.initHighlightingOnLoad();
            }
        },
    ]
});