test-markdown-element-attributes.html 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>reveal.js - Test Markdown</title>
  6. <link rel="stylesheet" href="../css/reveal.min.css">
  7. <link rel="stylesheet" href="qunit-1.12.0.css">
  8. </head>
  9. <body style="overflow: auto;">
  10. <div id="qunit"></div>
  11. <div id="qunit-fixture"></div>
  12. <div class="reveal" style="display: true;">
  13. <div class="slides">
  14. <!-- <section data-markdown="example.md" data-separator="^\n\n\n" data-vertical="^\n\n"></section> -->
  15. <!-- Slides are separated by newline + three dashes + newline, vertical slides identical but two dashes -->
  16. <section data-markdown data-separator="^\n---\n$" data-vertical="^\n--\n$" data-element-attributes="{_\s*?([^}]+?)}">>
  17. <script type="text/template">
  18. ## Slide 1.1
  19. <!-- {_class="fragment fade-out" data-fragment-index="1"} -->
  20. --
  21. ## Slide 1.2
  22. <!-- {_class="fragment shrink"} -->
  23. Paragraph 1
  24. <!-- {_class="fragment grow"} -->
  25. Paragraph 2
  26. <!-- {_class="fragment grow"} -->
  27. - list item 1
  28. <!-- {_class="fragment roll-in"} -->
  29. - list item 2
  30. <!-- {_class="fragment roll-in"} -->
  31. - list item 3
  32. <!-- {_class="fragment roll-in"} -->
  33. ---
  34. ## Slide 2
  35. Paragraph 1.2
  36. multi-line
  37. <!-- {_class="fragment highlight-red"} -->
  38. Paragraph 2.2
  39. <!-- {_class="fragment highlight-red"} -->
  40. Paragraph 2.3
  41. <!-- {_class="fragment highlight-red"} -->
  42. Paragraph 2.4
  43. <!-- {_class="fragment highlight-red"} -->
  44. - list item 1
  45. <!-- {_class="fragment highlight-green"} -->
  46. - list item 2
  47. <!-- {_class="fragment highlight-green"} -->
  48. - list item 3
  49. <!-- {_class="fragment highlight-green"} -->
  50. - list item 4
  51. <!-- {_class="fragment highlight-green"} -->
  52. - list item 5
  53. <!-- {_class="fragment highlight-green"} -->
  54. Test
  55. ![Example Picture](examples/assets/image2.png)
  56. <!-- {_class="reveal stretch"} -->
  57. </script>
  58. </section>
  59. </div>
  60. </div>
  61. <script src="../lib/js/head.min.js"></script>
  62. <script src="../js/reveal.min.js"></script>
  63. <script src="../plugin/markdown/marked.js"></script>
  64. <script src="../plugin/markdown/markdown.js"></script>
  65. <script src="qunit-1.12.0.js"></script>
  66. <script src="test-markdown-element-attributes.js"></script>
  67. </body>
  68. </html>