reveal.js HTML-презентации

источник ↗ ·

reveal.js — фреймворк для создания интерактивных HTML-презентаций с вложенными слайдами, анимациями и экспортом в PDF.

privacy

Эта заметка участвует в semantic memory.

AI Summary

  1. Краткий обзор сути: reveal.js — HTML-фреймворк для создания красивых интерактивных презентаций, созданный Hakim El Hattab и контрибьюторами. Позволяет использовать чистый HTML, CSS и JS вместо PowerPoint.

  2. Ключевые тезисы:

  • Вложенные (вертикальные) слайды: Space для навигации, ESC — обзор всех слайдов.
  • Авто-анимации: автоматическая анимация совпадающих элементов между слайдами.
  • Синтаксис-код: подсветка через highlight.js, примеры React-кода.
  • Фрагменты: разные типы появления элементов.
  • Фоны: цвет, изображение, видео, GIF, плитка; переходы настраиваются через backgroundTransition.
  • Zoom: Alt+клик (Ctrl+клик в Linux) для увеличения элемента.
  • События: data-state и Reveal.on('customevent').
  • Экспорт: в PDF.
  • Дополнительно: r-fit-text, тач-оптимизация, RTL, parallax, API, пауза (B/.), ссылки между слайдами, speaker view (S).
  1. Важные детали и нюансы:
  • Конфигурация: Reveal.configure({ backgroundTransition: 'zoom' }).
  • События: Reveal.on('customevent', function() { console.log(...); }).
  • Горячие клавиши: Space, ESC, S, B, ., Alt/Ctrl+клик.
  • Ссылки: https://slides.com (визуальный редактор), исходный код и документация.
  1. Практические выводы/следующие шаги: Использовать для веб-презентаций с кодом и интерактивом; попробовать редактор на slides.com; изучить API и data-атрибуты для кастомизации.

Мои мысли

graph

Карта связей