How to add a fixed footer on all slides?

若如初见. 提交于 2020-01-12 06:49:08

问题


I have a presentation set up with reveal.js which is meant to be used unattended. So, I want to be able to show a little footer (or another link somewhere) on all slides that points to an 'Information Slide' with data about the author, how to use the slides etc.

(This is to aid people who don't really know how to use reveal.js as well as to show authorship information in detail.)

I have not been able to find anything in the documentation and there does not seem to be a callback which I can utilize.


回答1:


This works for me (aligns to left edge as I use built-in controls on right).

Add this to your css:

.reveal .footer {
  position: absolute;
  bottom: 1em;
  left: 1em;
  font-size: 0.5em;
}

And in your html:

<div class='reveal'>
  <div class='footer'>
    Use left and right arrows to navigate
  </div>
...

If you want the footer to disappear as soon as user navigates (i.e. it should only be shown on first slide loaded because it is just a reminder), then add this to the end of your html:

<script>
  // displayed upon load, hides when slide changes
  Reveal.addEventListener('slidechanged', function(event) {
    document.querySelector('.reveal .footer').style.display = 'none';
  });
</script>

In order to get a fixed content in the PDF export (on all slides) you could find this answer useful.



来源:https://stackoverflow.com/questions/25479420/how-to-add-a-fixed-footer-on-all-slides

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!