the - reveal javascript

Fragmentos en reveal.js utilizando Markdown

Question

reveal.js admite fragmentos que se mostrarán uno tras otro en HTML

<section>
    <p class="fragment grow">grow</p>
    <p class="fragment shrink">shrink</p>
    <p class="fragment roll-in">roll-in</p>
    <p class="fragment fade-out">fade-out</p>
    <p class="fragment highlight-red">highlight-red</p>
    <p class="fragment highlight-green">highlight-green</p>
    <p class="fragment highlight-blue">highlight-blue</p>
</section>

Es compatible con MarkDown en lugar de HTML para cada diapositiva usando:

<section data-markdown>
    ## Page title

    A paragraph with some text and a [link](http://hakim.se).
</section>

Pero no pude encontrar ninguna documentación sobre el uso de fragmentos con MarkDown. ¿Perdí algo o aún no está soportado?

Answer 1

Ahora admite atributos, agregando la etiqueta: <!-- .element: class="fragment" --> .

Hay más atributos compatibles, como background , index , etc. Vea más ejemplos en el documento oficial: Atributos del elemento , Atributos de diapositiva .

Answer 2

Consulte este tema Markdown dentro de fragmentos , y creo que el fragmento solo se aplica en el nivel html.

Creo que puedes manipular el dom después de que Markdown se transforme directamente, así:

{ src: ''plugin/markdown/markdown.js'',
  condition: function() { return !!document.querySelector( ''[data-markdown]'' ); },
  callback: function() {
    Array.prototype.forEach.call(document.querySelectorAll(''section > p''), function(ele){ ele.className = ''fragment''; });
  }
},

Answer 3

Si está buscando crear fragmentos dentro de una sección con formato de reducción de precio como jez señaló en su comentario, esto es lo que necesita

* Item 1 <!-- .element: class="fragment" -->
* Item 2 <!-- .element: class="fragment" -->

Fuente original - https://stevegrunwell.com/blog/building-presentations-reveal-js/ (enlace muerto)

Hay otro tutorial: http://htmlcheats.com/reveal-js/reveal-js-tutorial-reveal-js-for-beginners/