Mercurial > hg > Papers > 2010 > jsst-shinya

annotate presen/xoxo-s5-demo.html @ 15:b3b5bcbba089

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
add slide: presen/index.html
author Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
date Sat, 11 Sep 2010 23:46:30 +0900
parents
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
15
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
3
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
4 <html xmlns="http://www.w3.org/1999/xhtml">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
5
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
6 <head>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
7 <title>S5: An Introduction</title>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
8 <!-- metadata -->
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
9 <meta name="generator" content="S5" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
10 <meta name="version" content="S5 1.1" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
11 <meta name="presdate" content="20050128" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
12 <meta name="author" content="Eric A. Meyer" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
13 <meta name="company" content="Complex Spiral Consulting" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
14 <!-- configuration parameters -->
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
15 <meta name="defaultView" content="slideshow" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
16 <meta name="controlVis" content="hidden" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
17 <!-- style sheet links -->
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
18 <link rel="stylesheet" href="ui/default/slides.css" type="text/css" media="projection" id="slideProj" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
19 <link rel="stylesheet" href="ui/default/outline.css" type="text/css" media="screen" id="outlineStyle" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
20 <link rel="stylesheet" href="ui/default/print.css" type="text/css" media="print" id="slidePrint" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
21 <link rel="stylesheet" href="ui/default/opera.css" type="text/css" media="projection" id="operaFix" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
22 <!-- embedded styles -->
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
23 <style type="text/css" media="all">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
24 .imgcon {width: 525px; margin: 0 auto; padding: 0; text-align: center;}
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
25 #anim {width: 270px; height: 320px; position: relative; margin-top: 0.5em;}
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
26 #anim img {position: absolute; top: 42px; left: 24px;}
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
27 img#me01 {top: 0; left: 0;}
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
28 img#me02 {left: 23px;}
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
29 img#me04 {top: 44px;}
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
30 img#me05 {top: 43px;left: 36px;}
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
31 </style>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
32 <!-- S5 JS -->
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
33 <script src="ui/default/slides.js" type="text/javascript"></script>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
34 </head>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
35 <body>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
36
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
37 <div class="layout">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
38 <div id="controls"><!-- DO NOT EDIT --></div>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
39 <div id="currentSlide"><!-- DO NOT EDIT --></div>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
40 <div id="header"></div>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
41 <div id="footer">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
42 <h1>S5 Testbed</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
43 <h2>Your computer &#8226; Today's date</h2>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
44 </div>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
45 </div>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
46
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
47 <ol class="xoxo presentation">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
48
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
49 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
50 <h1>S5 Testbed</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
51 <h3>Eric A. Meyer</h3>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
52 <h4><a href="http://www.complexspiral.com/" rel="external">Complex Spiral Consulting</a></h4>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
53 <div class="handout"></div>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
54 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
55
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
56
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
57 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
58 <h1>What Is S5?</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
59 <ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
60 <li>It's a <strong>S</strong>imple <strong>S</strong>tandards-based <strong>S</strong>lide <strong>S</strong>how <strong>S</strong>ystem</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
61 <li>One XHTML document provides all of the slide show's content</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
62 <li>CSS handles the layout and look of the slides</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
63 <li>JavaScript handles the dynamic aspects of the show</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
64 <li>That's all there is to it! (<a href="#slide9">skip to summary</a>; demonstrates links internal to the slide show)</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
65 </ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
66 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
67
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
68
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
69 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
70 <h1>Operatic Origins</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
71 <ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
72 <li>Opera 4 introduced <a href="http://www.opera.com/support/tutorials/operashow/" rel="external">Opera Show</a>, a projection-mode style sheet technology (link demonstrates external link styling and window spawning)</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
73 <li>Allows a single XHTML document to be turned into a PowerPoint-like slide show</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
74 <li>Adding screen and print style sheets allows for multi-medium views of a single document</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
75 <li>Highly efficient, but highly browser centric...</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
76 </ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
77 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
78
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
79
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
80 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
81 <h1>Incremental Display</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
82 <ul class="incremental show-first">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
83 <li>Keep hitting/clicking "next" as long as it isn't the control link (&raquo;)</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
84 <li>Bullet points are revealed one by one
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
85 <ul class="incremental">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
86 <li>All based on class name of <code>inc</code></li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
87 <li>Lists can be classed to make items appear individually</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
88 <li>Individual items can be classed as well to create "animations"; see <a href="http://boxofchocolates.ca/projects/s5-incremental-graphics/" rel="external">Derek Featherstone's example</a></li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
89 </ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
90 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
91 <li>Let's try it again, but without the first bullet point being pre-highlighted...</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
92 </ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
93 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
94
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
95
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
96 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
97 <h1>Incremental Display II</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
98 <ul class="incremental">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
99 <li>Keep hitting/clicking "next" as long as it isn't the control link (&raquo;)</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
100 <li>Bullet points are revealed one by one
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
101 <ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
102 <li>All based on class name of <code>incremental</code></li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
103 <li>Lists can be classed to make items appear individually</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
104 <li>Individual items can be classed as well to create "animations"; see <a href="http://boxofchocolates.ca/projects/s5-incremental-graphics/" rel="external">Derek Featherstone's example</a></li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
105 </ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
106 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
107 <li>Notice how the sub-list was part of the parent bullet point; that was done on purpose</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
108 <li>Now to move on to other test slides!</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
109 </ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
110 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
111
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
112
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
113 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
114 <h1>PNG Alpha Tests</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
115 <div style="width: 400px; height: 150px; text-align: center; background: url(ui/i18n/bg-shade.png)">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
116 <p>DIV with PNG background followed by foreground PNG</p>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
117 <img src="ui/i18n/bg-shade.png" alt="" title="A translucent image" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
118 </div>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
119 <div style="width: 100%; height: 150px; text-align: center; background: url(ui/i18n/bg-shade.png)">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
120 <p>DIV with PNG background followed by foreground PNG</p>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
121 <img src="ui/i18n/bg-shade.png" alt="" title="A translucent image" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
122 </div>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
123 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
124
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
125
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
126 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
127 <h1>S5 Default File Structure</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
128 <p style="text-align: center;">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
129 <img src="pix/s5filemap.png" alt="" title="At a Glance" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
130 </p>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
131 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
132
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
133
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
134 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
135 <h1>S5 Themes</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
136 <p class="imgcon">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
137 <img src="pix/S501.jpg" alt="" title="Default" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
138 <img src="pix/S502.jpg" alt="" title="I18N" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
139 <img src="pix/S503.jpg" alt="" title="Blue" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
140 <img src="pix/S504.jpg" alt="" title="Flower" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
141 (one way of presenting multiple graphics)
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
142 </p>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
143 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
144
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
145
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
146 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
147 <h1>Incremental S5 Themes</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
148 <p class="imgcon">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
149 <img src="pix/S501.jpg" alt="" title="Default" class="incremental" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
150 <img src="pix/S502.jpg" alt="" title="I18N" class="incremental" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
151 <img src="pix/S503.jpg" alt="" title="Blue" class="incremental" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
152 <img src="pix/S504.jpg" alt="" title="Flower" class="incremental" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
153 (one by one!)
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
154 </p>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
155 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
156
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
157
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
158 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
159 <h1>Incremental Animation</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
160 <ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
161 <li>A demonstration of just one of the many ways to accomplish simple animation-like effects <small>(using a diagram from <a href="http://gmpg.org/xfn/and/" rel="external">"XFN and..."</a>)</small></li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
162 </ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
163 <p class="imgcon" id="anim">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
164 <img src="pix/mememe01.png" id="me01" alt="" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
165 <img src="pix/mememe02.png" alt="" id="me02" class="incremental" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
166 <img src="pix/mememe03.png" alt="" id="me03" class="incremental" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
167 <img src="pix/mememe04.png" alt="" id="me04" class="incremental" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
168 <img src="pix/mememe05.png" alt="" id="me05" class="incremental" />
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
169 </p>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
170 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
171
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
172
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
173 <li class="slide">
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
174 <h1>In Summary</h1>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
175 <ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
176 <li>With minimal scripting, we have recreated and improved upon a (currently) browser-specific technology, making it cross-browser in the process</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
177 <li>The S5 format is OSF 1.0 compatible</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
178 <li>S5 is a very flexible and lightweight slide show system available for anyone to use</li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
179 </ul>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
180 </li>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
181
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
182 </ol>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
183
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
184 </body>
b3b5bcbba089 add slide: presen/index.html
Ryoma SHINYA <shinya@firefly.cr.ie.u-ryukyu.ac.jp>
parents:
diff changeset
185 </html>