index.html 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <!DOCTYPE html>
  2. <!--To run this example from a clone of the repository, run `yarn start`
  3. in the root KaTeX directory and then visit with your web browser:
  4. http://localhost:7936/contrib/auto-render/index.html
  5. -->
  6. <html>
  7. <head>
  8. <meta charset="UTF-8">
  9. <title>Auto-render test</title>
  10. <script src="/katex.js" type="text/javascript"></script>
  11. <script src="/contrib/auto-render.js" type="text/javascript"></script>
  12. <style type="text/css">
  13. body {
  14. margin: 0px;
  15. padding: 0px;
  16. font-size: 36px;
  17. }
  18. #test > .blue {
  19. color: blue;
  20. }
  21. </style>
  22. </head>
  23. <body>
  24. <div id="test">
  25. This is some text $math \frac12$ other text $\unsupported$
  26. <span class="blue">
  27. Other node \[ \text{displaymath} \frac{1}{2} \] blah $$ \int_2^3 $$
  28. </span>
  29. and some <!-- comment --> more text \(and math\) blah. And $math with a
  30. \$ sign$.
  31. <pre>
  32. Stuff in a $pre tag$
  33. </pre>
  34. <p>An AMS environment without <code>$$…$$</code> delimiters.</p>
  35. <p>\begin{equation} \begin{split} a &=b+c\\ &=e+f \end{split} \end{equation}</p>
  36. </div>
  37. <script>
  38. renderMathInElement(
  39. document.getElementById("test"),
  40. {
  41. delimiters: [
  42. {left: "$$", right: "$$", display: true},
  43. {left: "$", right: "$", display: false},
  44. {left: "\\begin{equation}", right: "\\end{equation}", display: true},
  45. {left: "\\begin{align}", right: "\\end{align}", display: true},
  46. {left: "\\begin{alignat}", right: "\\end{alignat}", display: true},
  47. {left: "\\begin{gather}", right: "\\end{gather}", display: true},
  48. {left: "\\(", right: "\\)", display: false},
  49. {left: "\\[", right: "\\]", display: true},
  50. ],
  51. throwOnError: false,
  52. }
  53. );
  54. </script>
  55. </body>
  56. </html>