Reveal.js: Auto-Slide Fragments Only

[frankstallone]

Is there a way to auto-slide fragments on a slide but _not_ the actual slide itself? When I get to slide X I want a few fragments to come on the screen in 2 second intervals. It would appear data-autoslide="2000" on the fragments only works if there is data-autoslide="x" in the <section> tag.

[developius]

I would also like this feature.
It's a bit strange because if you have this code

<section data-autoslide="1000">
    <img src="img/logo.png">
    <h3 class="fragment fade" data-autoslide="10000">Title goes here</h3>
</section>

then the fragment fades in after 1s and the presentation then moves to the next slide after 10s. This doesn't make sense to me - compared to the code.

However, if you reverse the data-autoslide values so they look like this

<section data-autoslide="10000">
    <img src="img/logo.png">
    <h3 class="fragment fade" data-autoslide="1000">Title goes here</h3>
</section>

then the fragment fades in after 10 seconds and then the presentation moves to the next slide after another second.

As @frankstallone said, if you don't specify the data-autoslide='x' in the <section> tag then nothing happens at all.

EDIT: It appears that using data-autoslide='x' on a fragment or a <section> specifies how long to wait until the _next_ slide or fragment comes in, instead of how long to wait until _itself_ comes in.

[developius]

To do what you want @frankstallone, you can do something like this:

<section data-autoslide="2000">
    <p class="fragment fade">I appear after 2 seconds</p>
    <p class="fragment fade">I appear after another 2 seconds</p>
    <p class="fragment fade">I appear after another 2 seconds</p>
    <p class="fragment fade">I appear after another 2 seconds</p>
    <p class="fragment fade">Last fragment with data-autoslide="0" stops next slide coming in</p>
</section>

[rejozenger]

I am very sorry to reopen this issue. Here's my problem. This works as expected (based on the description in this issue):

<section data-autoslide="2000">
    <p class="fragment fade">I appear after another 2 seconds</p>
    <p class="fragment fade" data-autoslide="0">Last fragment with data-autoslide="0" stops next slide coming in</p>
</section>

This, however, doesn't work as expected:

<section data-autoslide="2000">
    <p class="fragment fade" data-autoslide="0">Last fragment with data-autoslide="0" stops next slide coming in</p>
</section>

I'd expect the last (and only) fragment to appear after two seconds (and then leave it at that), but it doesn't.

[bennettscience]

@rejozenger This is old, but I solved this problem by adding an empty <p> tag with a fragment class and autoslide set to zero. It takes up no space on the viewport and it stops the slides from advancing.

<section data-autoslide="2000">
  <p class="fragment fade">Some text you want to appear</p>
  <p class="fragment" data-autoslide="0"></p> <!-- no one knows I exist! -->
</section>

[rparree]

@bennettscience that works for me, nice hack! Would be nice if there was a more solid way. I guess it would be best if there was a data-autofragment that gives us this behaviour.

[ITachiLab]

@bennettscience That's a good workaround, but enormously annoys me the growing progress bar, when this invisible fragments comes in.

[bennettscience]

@ITachiLab Yeah, it's definitely a hack, not a solution.

[ITachiLab]

@bennettscience I have applied a quick fix that introduces a new attribute for fragments: data-autoslide-stop. When added to a fragment, it will prevent from executing succeeding auto-slides. It's not ideal because it doesn't work when going back, but I needed a solution urgently.

Link to diff:

https://github.com/ITachiLab/reveal.js/commit/e8f2976a460fe29705e0f9571c75438d701f1558