#+AUTHOR: liuliancao
#+TITLE: reveal all example
#+OPTIONS: toc:nil num:nil
#+REVEAL_HLEVEL: 2
#+REVEAL_THEME: sky
* Hello, Reveal
  Hello, Reveal! this example mostly from [[https://github.com/yjwen/org-reveal][reveal github]]
** Hello, Again
   Hello, Again!
** Emacs setting with remote reveal
#+begin_src elisp
(with-eval-after-load 'org
  ;; support org-re-reveal for presentaion
  (require-package 'org-re-reveal)
  (require 'org-re-reveal)
  (setq org-re-reveal-root "https://cdn.bootcdn.net/ajax/libs/reveal.js/3.9.2/"
        org-re-reveal-revealjs-version "3.8")
#+end_src
* HLEVEL
  #+begin_src org
    #+REVEAL_HLEVEL: 2
  #+end_src
  HEVEL表示展示的层级，默认是1，表示每个章节先开始，然后是下面的章节，如果是2，
  则表示到第二个层级才开始向右,说白了就是把几级标题当成一个重新开始
* Split
#+REVEAL: split
i am now

i am liuliancao
#+REVEAL: split
i am now

i am liuliancao

Split的意思就是一个幻灯片太长了，这个适合可以分成两个篇幅
* Theme
[[https://revealjs.com/themes/][revealjs官网主题介绍]]
| Name      | Effect                                                |
|-----------+-------------------------------------------------------|
| black     | Black background, white text, blue links (default)    |
| white     | White background, black text, blue links              |
| league    | Gray background, white text, blue links               |
| beige     | Beige background, dark text, brown links              |
| sky       | Blue background, thin dark text, blue links           |
| night     | Black background, thick white text, orange links      |
| serif     | Cappuccino background, gray text, brown links         |
| simple    | White background, black text, blue links              |
| solarized | Cream-colored background, dark green text, blue links |
| blood     | Dark background, thick white text, red links          |
| moon      | Dark blue background, thick grey text, blue links     |

设置主题可以通过#+REVEAL_THEME: sky设置
#+BEGIN_NOTES
    Hello，大家好！
#+END_NOTES
* Slide
#+REVEAL_TITLE_SLIDE:%t
自定义title标题
* Background
** Colorful background
:PROPERTIES:
   :reveal_background: #321123
   :END:
** background with a image
:PROPERTIES:
    :reveal_background: ./images/reveal-background01.jpg
    :reveal_background_trans: slide
    :END:
** background with repeat image
:PROPERTIES:
    :reveal_background: ./images/reveal-background01.jpg
    :reveal_background_size: 200px
    :reveal_background_repeat: repeat
    :reveal_background_opacity: 0.2
    :END:
** iframe background
:PROPERTIES:
:reveal_background_iframe: https://hakim.se
:reveal_background: rgb(0,0,0)
:reveal_background_opacity: 0.8
:END:
* Header & Footer
#+REVEAL_SLIDE_HEADER: 我是header
#+REVEAL_SLIDE_FOOTER: 我是footer
* Fragment
段，比如一列一列
支持的动作
** actions
#+ATTR_REVEAL: :frag (grow shrink roll-in fade-out appear none)
- I will grow.
- I will shrink.
- I rolled in.
- I will fade out.
- I will appear.
- I don't fragment
** highlight
#+ATTR_REVEAL: :frag (appear)
- I will appear.
- I will appear.
- I will appear.
#+ATTR_REVEAL: :frag (highlight-blue)
- I will highlight.
- I will highlight.
- I will highlight.
* Auto-Animate
** Heading 1
       :PROPERTIES:
       :REVEAL_EXTRA_ATTR: data-auto-animate
       :END:
       #+ATTR_REVEAL: :data_id foo
       #+begin_src js
         let index = 1
       #+end_src
** Heading 2
  :PROPERTIES:
  :REVEAL_EXTRA_ATTR: data-auto-animate
  :END:


  #+ATTR_REVEAL: :data_id foo
  #+begin_src js
    let index = 1
    let value = 2
  #+end_src
* Ending
  Q&A
  Thank you