first version of mathjax plugin #531

edit
Hakim El Hattab 2013-08-12 09:21:38 -04:00
parent 41edd914ad
commit 1748a29ff3
2 changed files with 105 additions and 0 deletions

68
examples/math.html 100644
View File

@ -0,0 +1,68 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>reveal.js - The HTML Presentation Framework</title>
<meta name="description" content="A framework for easily creating beautiful presentations using HTML">
<meta name="author" content="Hakim El Hattab">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="../css/reveal.min.css">
<link rel="stylesheet" href="../css/theme/default.css" id="theme">
<!-- For syntax highlighting -->
<link rel="stylesheet" href="../lib/css/zenburn.css">
<!--[if lt IE 9]>
<script src="lib/js/html5shiv.js"></script>
<![endif]-->
</head>
<body>
<div class="reveal">
<div class="slides">
<section>
<h1>Reveal.js Math Plugin</h1>
</section>
<section>
\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</section>
</div>
</div>
<script src="../lib/js/head.min.js"></script>
<script src="../js/reveal.min.js"></script>
<script>
Reveal.initialize({
dependencies: [
{ src: '../lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: '../plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: '../plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: '../plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
{ src: '../plugin/math/math.js', async: true }
]
});
</script>
</body>
</html>

View File

@ -0,0 +1,37 @@
/**
* A plugin which enables rendering of math equations inside
* of reveal.js slides. Essentially a thin wrapper for MathJax.
*
* @author Hakim El Hattab
*/
(function(){
var head = document.querySelector( 'head' );
var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.src = 'http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG-full';
// Detect when the script has loaded
script.onload = onScriptLoad;
script.onreadystatechange = function() {
if ( this.readyState === 'loaded' ) {
onScriptLoad.call();
}
}
head.appendChild( script );
function onScriptLoad() {
MathJax.Hub.Config({
messageStyle: 'none',
tex2jax: { inlineMath: [['$','$'],['\\(','\\)']] }
});
Reveal.addEventListener( 'slidechanged', function( event ) {
MathJax.Hub.Rerender();
} );
}
})();