Фрагменты в show.js с использованием Markdown - программирование
Подтвердить что ты не робот

Фрагменты в show.js с использованием Markdown

opens.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>

Он поддерживает использование MarkDown вместо HTML для каждого слайда, используя:

<section data-markdown>
    ## Page title

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

Но я не мог найти документацию об использовании фрагментов с помощью MarkDown. Я что-то пропустил или еще не получил поддержку?

4b9b3361

Ответ 1

Теперь он поддерживает атрибуты, добавив тег: <!-- .element: class="fragment" -->.

Поддерживается больше атрибутов, таких как background, index и т.д. Дополнительные примеры в официальном документе: Атрибуты элементов, Атрибуты слайдов.

Ответ 2

Если вы хотите создать фрагменты внутри раздела с отформатированной разметкой, как указано в его комментарии, это то, что вам нужно

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

Исходный источник - https://stevegrunwell.com/blog/building-presentations-reveal-js/

Ответ 3

Пожалуйста, обратитесь к этому вопросу Markdown внутри фрагментов, и я думаю фрагмент применяется только на уровне html.

Я думаю, что вы можете манипулировать 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'; });
  }
},