1 <?xml version="1.0" encoding="utf-8" ?>
2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
5 <html xmlns="http://www.w3.org/1999/xhtml">
7 <title>SimpleWebSlides</title>
9 <meta http-equiv="Content-Type"
10 content="text/html; charset=utf-8" />
11 <meta name="copyright"
12 content="Copyright © 2013 Kim Nguyễn" />
14 <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"
16 <!-- allows to switch themes in firefox -->
18 <link rel="stylesheet" title="Default" href="../themes/default.css"
20 <link rel="alternate stylesheet" title="Web 2.0"
21 href="../themes/webTwoPointO.css"
24 <script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
25 <script src="../simpleWebSlides.js" type="text/javascript" ></script>
26 <!-- Customize some templates and initialize -->
27 <script type="text/javascript">
29 SWS.Presentation.setTemplate('sws-slide-change',
30 SWS.Effects.slideChangeVerticalSlide);
31 SWS.Presentation.setTemplate('sws-slide-change',
32 SWS.Effects.slideChangeHorizontalSlide);
33 SWS.Presentation.setTemplate('sws-slide-change',
34 SWS.Effects.slideChangeFadeOutIn);
36 SWS.Presentation.setTemplate('sws-slide-change',
37 SWS.Effects.slideChangeHorizontalFlip);
39 SWS.Presentation.setTemplate('sws-object-deactivate',
40 SWS.Effects.objectDeactivateFadeOut);
42 SWS.Presentation.setTemplate('sws-object-activate',
43 SWS.Effects.objectActivateFadeIn);
46 SWS.Presentation.init();
49 <style type="text/css">
54 -webkit-transform: rotate(-20deg);
55 -moz-transform: rotate(-20deg);
61 <div class="sws-slide sws-cover sws-option-nofooter">
62 <div class="centerbox">
63 <h1>SimpleWebSlides</h1>
64 <h1>An <em>HTML</em><img style="height:28pt"
65 src="http://www.w3.org/html/logo/downloads/HTML5_Badge.svg" alt="5"/>
66 Presentation framework</h1>
67 <a href="mailto:kim@nguyen.vg">kim@nguyen.vg</a>
74 <div class="sws-slide" >
76 <em>SimpleWebSlides</em> is simple tool that allows
77 you to build funky presentations:
79 <li class="sws-pause" >Write your presentations in (X)HTML5!</li>
80 <li class="sws-pause" >Theme to
81 your <span style='font-size:larger'>❤</span>'s content
82 with <em id="css">C S S</em>!</li>
83 <li class="sws-pause" >Create animations using Javascript & jQuery!</li>
84 <li class="sws-onslide-1_3_5_7">(I'm here every other frame)</li>
86 <script type="text/javascript">
87 var zoom_title = function (canvas) {
88 var h1 = canvas.find("h1");
89 var old_size = h1.css('font-size');
90 h1.animate({"font-size":"80pt" }, 300)
91 .animate({"font-size":old_size }, 300);
93 SWS.Presentation.registerCallback(3, zoom_title);
97 <div class="sws-slide">
98 <h1>What's wrong with Beamer/LateX/Tikz?</h1>
100 <li class="sws-pause">Does not easily support smooth
102 <li class="sws-pause">Hard to program/script </li>
103 <li class="sws-pause">Using modern fonts and UTF-8 is a nightmare</li>
104 <li class="sws-pause">Slow compilation times</li>
105 <li class="sws-pause">Difficult to integrate several media
106 (videos, vector graphics, sounds,…)