<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
>
-<html xmlns="http://www.w3.org/1999/xhtml">
+<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>SimpleWebSlides</title>
<!-- Load jQuery -->
<script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
+ <!-- Load the library -->
+ <script src="../simpleWebSlides.js" type="text/javascript" ></script>
- <!-- Initialize the library -->
<link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"
media="all" />
- <script src="../simpleWebSlides.js" type="text/javascript" >
- </script>
+ <!-- Load a custom Theme, the class-element marks this style-sheet
+ a "theme" that can be swtiched dynamicaly -->
+ <link class="sws-theme" rel="stylesheet" title="Web 2.0" href="../themes/webTwoPointO.css" type="text/css" />
+ <link class="sws-theme" rel="alternate stylesheet" title="U-Psud style" href="../themes/uPsud.css" type="text/css" />
+ <link class="sws-theme" rel="alternate stylesheet" title="Default style" href="../themes/default.css" type="text/css" />
- <!-- Load a custom Theme -->
- <link rel="stylesheet" title="Web 2.0"
- href="../themes/webTwoPointO.css"
- type="text/css" />
<!-- Customize some templates and initialize -->
<script type="text/x-mathjax-config">
</script>
<script type="text/javascript">
-/*
- SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeVerticalSlide;
- SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeHorizontalSlide; */
- SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
-
+// SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeVerticalSlide;
+// SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeHorizontalSlide;
+ SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
SWS.Config['sws-object-deactivate'] = SWS.Effects.objectDeactivateFadeOut;
SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
(videos, vector graphics, sounds,…)
</li>
</ul>
- <p class="sws-pause">But wait! I'm loosing all those nicely
- rendered mathematical formulæ!</p>
- <p class="sws-pause"> You mean like this one<sup>*</sup> ?
- $$
+ <h1> What's wrong with Powerpoint/Keynote/LibreOffice ?</h1>
+ <span class="sws-pause">Seriously ?</span>
+ </div>
+ <div class="sws-slide">
+ <h1>Can I really use SWS for <i>scientific</i> presentations?</h1>
+ <p class="sws-pause">You sure can:</p>
+ <ul class="sws-pause">
+ <li> Exhibit A: $$
F_n = \frac{1}{\sqrt{5}}\cdot\left(\frac{1+\sqrt{5}}{2}\right)^n-\frac{1}{\sqrt{5}}\cdot\left(\frac{1-\sqrt{5}}{2}\right)^n
- $$
- </p>
- <p class="sws-pause">or that one<sup>*</sup> ?
-
- $$
+ $$</li>
+ <li>Exihbit B: $$
\frac{\Gamma\cup\{x\mapsto t\}\vdash e : s}{\Gamma\vdash \lambda x^{t}.e : t \rightarrow s}
- $$
- </p>
- <p class="sws-pause">*: All this is done
+ $$</li>
+ </ul>
+ <p class="sws-pause"> All this is done
using <a href="http://www.mathjax.org">MathJax!</a> and
written like this:<br/>
<pre><code>
- \frac{
- \Gamma\cup\{x\mapsto t\}\vdash e : s
- }{
- \Gamma\vdash \lambda x^{t}.e : t \rightarrow s
+ \frac{ \Gamma\cup\{x\mapsto t\}\vdash e : s
+ }{ \Gamma\vdash \lambda x^{t}.e : t \rightarrow s
}
</code></pre>
</p>
</div>
- <div class="sws-slide">
- <h1>A simple example</h1>
- <p class="sws-onframe-1_3">
- A minimal slide, with no animation looks like this:
-<pre><code>
- <div <em>class="sws-slide"</em>>
- <h1>Slide title</h1>
- Hello world!
- </div>
-</code></pre>
-</p>
-<p class="sws-pause">
- You can also reveal things progressively like this:
- <pre><code>
- <p> Text 1</p>
- <p <em>class="sws-pause"</em>>
- Text 2 (appears afterwards)
- </p>
- </code></pre>
-</p>
-<p class="sws-pause">
- You can also set an element to appear on specific frames:
- <pre><code>
- <p> Text 1</p>
- <p <em>class="sws-onframe-1-5_9"</em>>
- Appears on frame 2, 3, 4, 5, 6 and 10 of the current slide
+
+<div class="sws-slide">
+ <h1>A simple example</h1>
+ <p class="sws-onframe-1_3">
+ A minimal slide, with no animation looks like this:
+ <code>
+ <div <em>class="sws-slide"</em>>
+ <![CDATA[ <h1> Slide title </h1>
+ Hello world!
+ </div> ]]>
+ </code>
+ </p>
+ <p class="sws-pause">
+ You can also reveal things progressively like this:
+ <code><![CDATA[
+ <p> Text 1 </p>
+ <p ]]><em>class="sws-pause"</em><![CDATA[> Text 2 (appears afterwards) </p>]]>
+ </code>
+ </p>
+ <p class="sws-pause">
+ You can also set an element to appear on specific frames:
+ <code><![CDATA[
+ <p>Text1</p>
+ <p ]]> <em>class="sws-onframe-1-5_9"</em> <![CDATA[ >
+ Appears on frame 1, 2, 3, 4, 5, and 9 of the current slide
(frame numbering starts at 0).
- </p>
- </code></pre>
-</p>
- </div>
+ </p> ]]>
+ </code>
+ </p>
+</div>
<div class="sws-slide">
<h1>Scripting your presentation</h1>
<p>
Of course, you can script your presentation with Javascript!<br/>
You just need to add the <code>script</code> element somewhere in
the current <code>div</code>
- <pre><code>
-<script type="text/javascript">
+ <code>
+<![CDATA[
+ <script type="text/javascript">
function zoom_title (canvas) {
var h1 = canvas.find("h1");
var old_size = h1.css('font-size');
.animate({"font-size":old_size }, 300);
};
//Call the zoom_title function on the 4th and 7th frame
- <em>SWS.Presentation.registerCallback("3_6", zoom_title);</em>
-<script>
-</code></pre>
+ ]]><em>SWS.Presentation.registerCallback("3_6", zoom_title);</em><![CDATA[
+</script>]]>
+</code>
(That's not a bug, you should keep pressing next, see how many
steps there are on this slide)
</p>
<script type="text/javascript">
- SWS.Presentation.registerCallback("4_7", zoom_title);
+ SWS.Presentation.registerCallback("3_6", zoom_title);
</script>
</div>
BTW did you see how I changed the transition effect for the
previous slide ?
</p>
+ <script type="text/javascript">
+ SWS.Presentation.registerCallback("1", zoom_title);
+ </script>
</div>
</body>