31

Reveal.js は、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>

以下を使用して、各スライドで HTML の代わりに Markdown の使用をサポートします。

<section data-markdown>
    ## Page title

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

しかし、Markdown でのフラグメントの使用に関するドキュメントは見つかりませんでした。何か見逃していましたか、それともまだサポートされていませんか?

4

5 に答える 5

11

jezがコメントで指摘したように、マークダウン形式のセクション内にフラグメントを作成しようとしている場合、これが必要です

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

元のソース - https://stevegrunwell.com/blog/building-presentations-reveal-js/ (リンク切れ)

別のチュートリアルがあります - http://htmlcheats.com/reveal-js/reveal-js-tutorial-reveal-js-for-beginners/

于 2016-09-21T13:59:33.223 に答える
4

この問題Markdown inside fragmentを参照してください。フラグメントは HTML レベルにのみ適用されると思います。

次のように、Markdown が直接変換された後に DOM を操作できると思います。

{ 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'; });
  }
},
于 2013-03-12T05:52:46.150 に答える