Skip to content

Instantly share code, notes, and snippets.

@bddap
Created July 14, 2018 01:56
Show Gist options
  • Save bddap/12ce439af646e27670ade3c3d6fd12e6 to your computer and use it in GitHub Desktop.
Save bddap/12ce439af646e27670ade3c3d6fd12e6 to your computer and use it in GitHub Desktop.
link to this script and each your <section> tag becomes a separate slide.
let currentSlide = 0;
function display(slide) {
const sections = document.getElementsByTagName('section');
currentSlide = Math.min(Math.max(slide, 0), sections.length - 1);
Array.from(sections).forEach((section, index) => {
section.style.display = index === currentSlide ? null : 'none';
})
}
document.addEventListener('keydown', event => {
if(event.key === 'ArrowRight' || event.key == ' ') display(currentSlide + 1);
if(event.key === 'ArrowLeft') display(currentSlide - 1);
});
document.addEventListener("DOMContentLoaded", () => display(0));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment