diff options
Diffstat (limited to 'stylesheets/lfs-xsl/docbook-xsl-1.78.1/slides/slidy/Overview.html')
-rwxr-xr-x | stylesheets/lfs-xsl/docbook-xsl-1.78.1/slides/slidy/Overview.html | 911 |
1 files changed, 0 insertions, 911 deletions
diff --git a/stylesheets/lfs-xsl/docbook-xsl-1.78.1/slides/slidy/Overview.html b/stylesheets/lfs-xsl/docbook-xsl-1.78.1/slides/slidy/Overview.html deleted file mode 100755 index 69f72f635..000000000 --- a/stylesheets/lfs-xsl/docbook-xsl-1.78.1/slides/slidy/Overview.html +++ /dev/null @@ -1,911 +0,0 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" - "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> -<html lang="en-US"> -<head> -<meta name="generator" content= -"HTML Tidy for Linux/x86 (vers 1st November 2003), see www.w3.org" /> -<title>HTML Slidy</title> -<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> -<meta name="copyright" content= -"Copyright © 2005-2010 W3C (MIT, ERCIM, Keio)" /> -<meta name="duration" content="5" /> -<meta name="font-size-adjustment" content="-2" /> -<link rel="stylesheet" href="styles/slidy.css" type="text/css" /> -<link rel="stylesheet" href="styles/w3c-blue.css" type="text/css" /> -<script src="scripts/slidy.js" charset="utf-8" type="text/javascript"> -</script> -</head> -<body> -<div class="background"><img alt="" id="head-icon" -src="graphics/icon-blue.png" /><object id="head-logo" -data="graphics/w3c-logo-white.svg" type="image/svg+xml" -title="W3C logo"><a href="http://www.w3.org/"><img -alt="W3C logo" id="head-logo-fallback" -src="graphics/w3c-logo-white.gif" /></a></object></div> - -<div class="background slanty"> -<img src="graphics/w3c-logo-slanted.jpg" alt="slanted W3C logo" /> -</div> -<div class="slide cover title"> - <!-- hidden style graphics to ensure they are saved with other content --> - <img class="hidden" src="graphics/bullet.png" alt="" /> - <img class="hidden" src="graphics/fold.gif" alt="" /> - <img class="hidden" src="graphics/unfold.gif" alt="" /> - <img class="hidden" src="graphics/fold-dim.gif" alt="" /> - <img class="hidden" src="graphics/nofold-dim.gif" alt="" /> - <img class="hidden" src="graphics/unfold-dim.gif" alt="" /> - <img class="hidden" src="graphics/bullet-fold.gif" alt="" /> - <img class="hidden" src="graphics/bullet-unfold.gif" alt="" /> - <img class="hidden" src="graphics/bullet-fold-dim.gif" alt="" /> - <img class="hidden" src="graphics/bullet-nofold-dim.gif" alt="" /> - <img class="hidden" src="graphics/bullet-unfold-dim.gif" alt="" /> - -<img src="graphics/keys2.jpg" alt="Cover page images (keys)" - class="cover" /><br clear="all" /> -<h1>HTML Slidy: Slide Shows in HTML and XHTML</h1> - -<p><a href="http://www.w3.org/People/Raggett/">Dave Raggett</a>, -<<a href="mailto:dsr@w3.org">dsr@w3.org</a>><br /> -<br /> -<br /> -<br /> -<br /><em>Hit the space bar or swipe left for next slide</em></p> -</div> - -<div class="slide"> -<h1>Slide Shows in HTML and XHTML</h1> - -<ul> -<li>You can now create accessible slide shows with ease</li> - -<li>Works across browsers and is operated like PowerPoint - -<ul> -<li>Advance to next slide with mouse click, space bar or swipe left</li> - -<li>Move forward/backward between slides with Cursor Left, -Cursor Right, <strong>Pg Up</strong> and <strong>Pg Dn</strong> -keys, or swipe left or right</li> - -<li><strong>Home</strong> key for first slide, <strong>End</strong> - key for last slide</li> - -<li>The "<strong>C</strong>" key for an automatically generated -table of contents, or click on "contents" on the toolbar or -swipe up or down</li> - -<li>Function <strong>F11</strong> to go full screen and back</li> - -<li>The "<strong>F</strong>" key toggles the display of the footer</li> - -<li>The "<strong>A</strong>" key toggles display of current vs all -slides - -<ul> -<li>Try it now to see how to include notes for handouts (this is -explained in the notes following this slide)</li> -</ul> -</li> - -<li>Font sizes automatically adapt to browser window size - -<ul> -<li>use <strong>S</strong> and <strong>B</strong> keys for -manual control (or < and >, or the <strong>-</strong> and -<strong>+</strong> keys on the number pad</li> -<li>Use CSS to set a relative font size on a given slide to make -the content bigger or smaller than on other slides</li> -</ul> -</li> - -<li>Switching off JavaScript reveals all slides</li> -</ul> -</li> - -<li><em>Now move to next slide to see how it works</em></li> -</ul> - -<p class="copyright"><a rel="Copyright" href= -"http://www.w3.org/Consortium/Legal/ipr-notice#Copyright" shape= -"rect">Copyright</a> © 2005-2010 <a href="/"><acronym title= -"World Wide Web Consortium">W3C</acronym></a> <sup>®</sup> -(<a href="http://www.csail.mit.edu/"><acronym title= -"Massachusetts Institute of Technology">MIT</acronym></a>, <a href= -"http://www.ercim.org/"><acronym title= -"European Research Consortium for Informatics and Mathematics">ERCIM</acronym></a>, -<a href="http://www.keio.ac.jp/">Keio</a>), All Rights -Reserved.</p> -</div> - -<div class="handout"> -<p>For handouts, its often useful to include extra notes using a -div element with class="handout" following each slide, as in:</p> - -<pre> -<div class="slide"> - <em>... your slide content ...</em> -</div> - -<div class="handout"> - <em>... stuff that only appears in the handouts ...</em> -</div> -</pre> -</div> - -<div class="slide"> -<h1>What you need to do</h1> - -<ul> -<li>Each presentation is a single XHTML file</li> - -<li>Each slide is enclosed in <em><div class="slide"> ... -</div></em> - -<ul> -<li>The div element will be created automatically for h1 -elements that are direct children of the body element.</li> -</ul> - -</li> - -<li>Use regular markup within each slide</li> - -<li>The document head includes two links: -<ul> -<li>The slide show style sheet: -<a href= -"http://www.w3.org/Talks/Tools/Slidy2/styles/slidy.css">http://www.w3.org/Talks/Tools/Slidy2/styles/slidy.css</a></li> - -<li>The slide show script: <a href= -"http://www.w3.org/Talks/Tools/Slidy2/scripts/slidy.js">http://www.w3.org/Talks/Tools/Slidy2/scripts/slidy.js</a></li> - -<li>Or you can link to the compressed version of the script which is about -one seventh the size, see <a href= -"http://www.w3.org/Talks/Tools/Slidy2/scripts/slidy.js.gz">http://www.w3.org/Talks/Tools/Slidy2/scripts/slidy.js.gz</a></li> -<li>If you are using XHTML, remember to use </script> and -</style> as per <a -href="http://www.w3.org/TR/xhtml1/#C_3">Appendix C.3</a></li> -</ul> -</li> -</ul> - -<pre> -<?xml version="1.0" encoding="utf-8"?> -<!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" lang="en" xml:lang="en"> -<head> - <title>Slide Shows in XHTML</title> - <meta name="copyright" - content="Copyright &#169; 2005 your copyright notice" /> - <link rel="stylesheet" type="text/css" media="screen, projection, print" - href="http://www.w3.org/Talks/Tools/Slidy2/styles/slidy.css" /> - <script src="http://www.w3.org/Talks/Tools/Slidy2/scripts/slidy.js" - charset="utf-8" type="text/javascript"></script> - <style type="text/css"> - <!-- your custom style rules --> - </style> -</head> -<body> - ... your slides marked up in XHTML ... -</body> -</html> -</pre> -</div> - -<div class="slide"> -<h1>To get the W3C Blue Style</h1> - -<p>The head element should include the following link to the style -sheet:</p> - -<pre> -<link rel="stylesheet" type="text/css" media="screen, projection, print" - href="http://www.w3.org/Talks/Tools/Slidy2/styles/w3c-blue.css" /> -</pre> - -<p>The body element's content should start with the following -markup:</p> - -<pre> -<div class="background"> - <img id="head-icon" alt="graphic with four colored squares" - src="http://www.w3.org/Talks/Tools/Slidy2/graphics/icon-blue.png" /> - <object id="head-logo" title="W3C logo" type="image/svg+xml" - data="http://www.w3.org/Talks/Tools/Slidy2/graphics/w3c-logo-white.svg"><img - src="http://www.w3.org/Talks/Tools/Slidy2/graphics/w3c-logo-white.gif" - alt="W3C logo" id="head-logo-fallback" /></object> -</div> -</pre> - -<p>This adds the logos on the top left and right corners of the -slide.</p> - -<p>You are of course welcome to create your own slide designs. -You can provide different styles and backgrounds for -different slides (more details later).</p> - -<p>Use the <em>meta element</em> with <em>name="copyright"</em> -for use in the slide show footer:</p> - -<pre> -<meta name="copyright" -content="Copyright &#169; 2005-2009 W3C (MIT, ERCIM, Keio)" /> -</pre> -</div> - -<div class="slide"> -<h1>Upgrading from previous versions of Slidy</h1> - -<ul> -<li>This uses a new version of the HTML Slidy script</li> -<li>It is designed to work better with other scripts, -e.g. for UI controls within your slides -<ul> -<li>Only adds one global name "w3c_slidy"</li> -<li>Doesn't interfere with other scripts that set event handers -such as onload on body element</li> -</ul> -</li> -<li>Works for slides delivered as text/html and application/xhtml+xml</li> -<li>New presentation timer feature</li> -<li>Initial prompt on first slide to help newcomers to Slidy</li> -<li>Better support for styling slides and printing them</li> -<li>Requires additional style rules, so new script won't work -with old presentations without changes to their style sheets -<ul> -<li>See <a href="styles/slidy.css">slidy.css</a>, and -<a href="styles/w3c-blue.css">w3c-blue.css</a></li> -</ul> -</li> -<li>But old presentations will work unchanged as they refer to -the old script!</li> -</ul> -</div> - -<div class="slide"> -<h1>To use it off-line</h1> - -<ul> -<li>You can download <a href="slidy.zip">slidy.zip</a> and unzip -it to create a Slidy directory on your machine</li> - -<li>If you have cvs access to the W3C site you can check out the Slidy -directory</li> - -<li>Remember to periodically check for updates</li> - -<li>You then have two choices: - -<ol> -<li>Use relative URIs depending on your local setup to access the -appropriate files. Use the same directory structure as on the W3C -server, ie, ".../2005/Talks/...".</li> - -<li>Run a Web server on your machine so that the directory above -can be accessed via <code>http://localhost/Talks/Tools/Slidy2</code> -and use the URIs of the form "/Talks/Tools/Slidy2/styles/slidy.css", -"/Talks/Tools/Slidy2/scripts/slidy.js".</li> -</ol></li> - -<li>In both cases you can then publish your files on the W3C server -unchanged.</li> - -<li><strong>NOTE</strong> Internet Explorer on Windows XP now disables -scripting for web pages loaded directly from the local file system, -a work around is to use another browser, e.g. Firefox or Opera</li> - -<li>Please feel free to create your own designs, and help us to build -a gallery of Slidy styles.</li> - -<li>My <a href="/2006/02/woa/">Google TechTalk</a> (1st Feb 2006) -uses a notebook themed style</li> -</ul> -</div> - -<div class="slide"> -<h1>Timing Your Presentation</h1> - -<ul> -<li>Sometimes it is handy to know just how much time you have to -left to finish your presentation</li> -<li>To get this feature, add the following markup to the -content of the head element, replacing 5 by the duration -of your presentation in minutes -<pre><meta name="duration" content="5" /></pre> -</li> -<li>The time left in minutes and seconds is shown in the footer -next to the slide number</li> -<li>The clock starts to run when you move away from the first slide</li> -<li>Moving back to the first slide pauses the clock</li> -</ul> - - -</div> - -<div class="slide slanty"> -<h1>Generate a Title Page</h1> - -<p>If you want a separate title page with the W3C blue style, the -first slide should be as follows:</p> - -<pre> -<div class="slide cover"> - <img src="http://www.w3.org/Talks/Tools/Slidy2/graphics/keys.jpg" - alt="Cover page images (keys)" class="cover" /> - <br clear="all" /> - <h1>HTML Slidy: Slide Shows in XHTML</h1> - <p><a href="http://www.w3.org/People/Raggett/">Dave Raggett,</a> - <a href="mailto:dsr@w3.org">dsr@w3.org</a></p> -</div> -</pre> - -<p>The <a -href="http://www.w3.org/Talks/Tools/Slidy2/graphics/w3c-blue.css">w3c-blue.css</a> -style sheet looks for the classes "slide" and "cover" on div -and img elements using the CSS selector <em>div.slide.cover</em></p> - -<p>This technique can be used to assign your slides to different -classes with a different appearence for each such class.</p> - -<p>Slidy also allows you to use different background markup for -different slides, based upon shared class names, as in "foo" below. -Backgrounds without additional class names are always shown except -when the slide isn't transparent. You may need to tweak your -custom style sheet.</p> - -<pre> -<div class="background foo"> - ... background content ... -<div> - -... - -<div class="slide foo"> - ... slide content ... -<div> -</pre> -</div> - -<div class="slide"> -<h1>Incremental display of slide contents</h1> - -<p>For incremental display, use class="incremental", for -instance:</p> - -<ul class="incremental"> -<li>First bullet point</li> - -<li>Second bullet point</li> - -<li>Third bullet point</li> -</ul> - -<p class="incremental">which is marked up as follows:</p> - -<pre class="incremental"> -<ul class="incremental"> - <li>First bullet point</li> - <li>Second bullet point</li> - <li>Third bullet point</li> -</ul> - -<p class="incremental">which is marked up as follows:</p> - -<pre class="incremental"> - ... -</pre> -</pre> - -<div class="footnote"> -<p>An element is incrementally revealed if its parent element has -class="incremental" or if itself has that attribute. Text nodes are -not elements and are revealed when their parent element is revealed. -You can use class="incremental" on any element except for <br />. -Use class="non-incremental" to override the effect of setting the -parent element's class to incremental.</p> - -<p>Note: you will see a red asterisk on the left of the toolbar -when there is still something more to reveal.</p> -</div> -</div> - -<div class="slide"> -<h1>Create outline lists with hidden content</h1> - -<p>You can make your bullet points or numbered list items -into outlines that you can expand or collapse</p> - -<ul class="outline"> -<li>Just add <em>class="outline"</em> to the ul or ol -element. Click on this list item for more details. - -<ul> -<li>The Slidy script will then treat the list -as an outline list.</li> -<li>Clicking on outline list items will expand/collapse -block-level elements within that list item.</li> -<li>Click on the above to make this list item -collapse again.</li> -</ul> -</li> -<li>Users will then see expand/collapse icons as appropriate -and may click anywhere on the list item to change its state. -This particular list item can't be expanded or collapsed.</li> -<li class="expand">Add class="expand" to any li elements that -you want to start in an expanded state. - -<ul> -<li>By default Slidy hides all the block level elements within the -outline list items unless you have specified class="expand".</li> -<li>Such pre-expanded items can be collapsed by clicking on them.</li> -</ul> -</li> -<li>Note expand/collapse icon highlighting requires browser -support for :hover which isn't supported by IE6. - -<ul> -<li>Microsoft says it will be supported by IE7 along with -many fixes for other CSS woes in IE6.</li> -</ul> -</li> -</ul> - -<pre> -<ol class='outline'> - <!-- topic 1 starts collapsed --> - <li>Topic 1 - <ol> - <li>subtopic a</li> - <li>subtopic b</li> - </ol> - </li> - <!-- topic 2 starts expanded --> - <li class="expand">Topic 2 - <ol> - <li>subtopic c</li> - <li>subtopic d</li> - </ol> - </li> -</ol> -</pre> -</div> - -<!-- useful info at http://www.howtocreate.co.uk/wrongWithIE/ --> -<div class="slide"> -<h1>Make your images scale with the browser window size</h1> - -<p>For adaptive layout, use percentage widths on images, together -with CSS positioning:</p> - -<ul> -<li>CSS positioning is simpler and more reliable than using -tables</li> -</ul> - -<pre> -<div class="slide"> - <h1>Analysts - "Open standards programming will become - mainstream, focused around VoiceXML"</h1> - <!-- use CSS positioning and scaling for adaptive layout --> - <img src="trends.png" width="50%" style="float:left" - alt="projected growth of VoiceXML" /> - - <blockquote style="float:right;width: 35%"> - VoiceXML will dominate the voice environment, due to its - flexibility and eventual multimodal capabilities - </blockquote><br clear="all" /> - - <p style="text-align:center">Source Data Monitor, March - 2004</p> -</div> -</pre> - -<p>To work around a CSS rendering bug in IE relating -to margins, you can set display:inline on floated elements.</p> -</div> - -<div class="slide"> -<h1>Incremental display of layered images</h1> - -<p>These can be marked up using CSS relative positioning, e.g.</p> - -<pre> -<div class="incremental" - style="margin-left: 4em; position: relative"> - <img src="graphics/face1.gif" alt="face" - style="position: static; vertical-align: bottom"/> - <img src="graphics/face2.gif" alt="eyes" - style="position: absolute; left: 0; top: 0" /> - <img src="graphics/face3.gif" alt="nose" - style="position: absolute; left: 0; top: 0" /> - <img src="graphics/face4.gif" alt="mouth" - style="position: absolute; left: 0; top: 0" /> -</div> -</pre> - -<p style="font-size: smaller;">You should also use transparent GIF -images to avoid the IE/Win bug for alpha channel in PNG. A fix is -expected in IE 7. A <a href= -"http://www.skyzyx.com/scripts/sleight.php">work around</a> is -available on skyzyx.com. My thanks to <a href= -"http://www.webstandards.org/act/acid2/">ACID2</a> for the -graphics.</p> - -<div class="incremental" style= -"margin-left: 4em; position: relative;"><img src="graphics/face1.gif" alt= -"face" style="position: static; vertical-align: bottom;" /> -<img src="graphics/face2.gif" alt="eyes" style= -"position: absolute; left: 0pt; top: 0pt;" /> <img src="graphics/face3.gif" -alt="nose" style="position: absolute; left: 0pt; top: 0pt;" /> -<img src="graphics/face4.gif" alt="mouth" style= -"position: absolute; left: 0pt; top: 0pt;" /></div> -</div> - -<div class="slide"> -<h1>How to center content vertically and horizontally</h1> -<div class="vbox"></div> -<div class="hbox"> -<p>Within the div element for your slide:</p> -<pre> -<div class="vbox"></div> -<div class="hbox"> -Place the content here -</div> -</pre> -<p>and style it with the following:</p> -<pre> -div.vbox { - float: left; - height: 40%; width: 50%; - margin-top: -220px; -} -div.hbox { - width:60%; margin-top: 0; - margin-left:auto; margin-right:auto; - height: 60%; - border:1px solid silver; - background:#F0F0F0; - overflow:auto; - text-align:left; - clear:both; -} -</pre> - -<p>The above styling is included in <a href="styles/w3c-blue.css">w3c-blue.css</a>, -which is designed to be used with <a href="styles/slidy.css">slidy.css</a>, but you -are encouraged to develop your own style sheet with your own look and feel.</p> -</div> -</div> - -<div class="slide"> -<h1>Include SVG Content</h1> - -<p>Inclusion of SVG content can be done using the object element, -for example:</p> - -<div style="text-align: center;"><object data="graphics/example.svg" type= -"image/svg+xml" title="Indian Office logo" height="10%" width= -"50%"><img src="graphics/example.png" alt="Indian Office logo" width= -"50%" /></object></div> - -<p>has been achieved by:</p> - -<pre> -<object data="graphics/example.svg" type="image/svg+xml" - width="50%" height="10%" title="Indian Office logo"> - <img src="graphics/example.png" width="50%" - alt="Indian Office logo" /> -</object> -</pre> - -<p>This ensures that the enclosed png is displayed when the browser -has no plugin installed or can't display SVG directly. Providing -such a fall back is very important! Don't forget the alt text for -people who can't see the image.</p> - -<p>However, there are caveats, see the next slide!</p> -</div> - -<div class="slide"> -<h1>Caveats with SVG+object</h1> - -<p>Adobe has recently withdrawn support for its SVG Viewer, so you are -recommended to consider <a -href="http://wiki.svg.org/Viewer_Implementations">alternatives</a>. -If you still using the Adobe SVG viewer you should be aware of bugs -when using the it with IE, Namely:</p> - -<ul> -<li>Most modern browsers generally support SVG SVG Tiny 1.1 or better -natively without the need for a plugin</li> - -<li>If you need to use Internet Explorer you are advised to upgrade -to IE9 which includes native support for SVG.</li> - -<li>Patches to Internet Explorer mean that the Adobe SVG Viewer -version 3.03 no longer works with IE6. You are therefore recommended -to uninstall version 3.03 and instead install <a -href="http://www.adobe.com/svg/viewer/install/beta.html">Adobe SVG Viewer -6.0 preview</a> if this is available to to you.</li> - -<li>IE6 makes a <em>copy</em> of the SVG file on the local disc -when displaying it; but doesn't pass the original URI to the plugin</li> - -<li>As a result relative references from within the SVG to external -resources (scripts, CSS, images, other SVG) will break.</li> - -<li>The work around is to use absolute references within your SVG.</li> - -<li>On Windows, the Adobe SVG plugin doesn't respect the CSS z-index -property, and if used on backgrounds will always show through other -content</li> -</ul> -</div> - -<div class="slide"> -<h1>Additional Remarks</h1> - -<ul> -<li>Slides are auto-numbered on the slide show footer</li> - -<li>You can link into the <a href="#(2)">middle</a> of a slide -show: - -<ul> -<li>It works out which slide you want and hides the rest</li> - -<li>You can even link between slides in the same slide show</li> - -<li>Individual sides can be addressed with the syntax #(<em>slide -number</em>),<br /> -e.g. slide 3 of this presentation is: <a href= -"#(3)">http://www.w3.org/Talks/Tools/Slidy#(3)</a> -<ul> -<li>Previous versions of Slidy used square brackets, which will -also work.</li> -</ul></li> -<li>Note that the browser's back/forward buttons may not work as -you might expect due to browser problems.</li> -</ul> -</li> - -<li>Adding "title" to the list of classes for div elements that serve -as title pages will render the corresponding entry in the table of -contents in bold italic text (press "C" now for an example)</li> - -<li>If your slides have more content than normal, use a <em>meta -element</em> to request a smaller font - -<ul> -<li>the following requests fonts to be one step smaller than -the Slidy default for the current window width, and positive -integers will make the fonts correspondingly larger</li> -</ul> - -<pre> -<meta name="font-size-adjustment" content="-1" /> -</pre> - -<ul> -<li>Slidy uses JavaScript to dynamically set the font size on the -body element, but it is okay to specify relative font changes on -other elements within your own style sheet, e.g.</li> -</ul> -<pre>div.slide.large { font-size: 200% }</pre> -</li> - -<li>You are encouraged to ensure your markup is valid. <a href= -"http://www.w3.org/People/Raggett/tidy/">HTML Tidy</a> can be used -to find and correct common markup problems</li> - -<li>The slide show script and style sheet can be used freely under -W3C's <a href= -"http://www.w3.org/Consortium/Legal/copyright-software">software -licensing</a> and <a href= -"http://www.w3.org/Consortium/Legal/copyright-documents">document -use</a> policies</li> -<li>At <a href="http://xtech06.usefulinc.com/">XTech2006</a> -I gave this <a href="http://www.w3.org/2006/05/Slidy-XTech/">presentation</a> -on Slidy -(<a href="http://www.w3.org/2006/05/Slidy-XTech/slidy-xtech06-dsr.pdf">Paper</a>).</li> -</ul> -</div> - -<div class="slide"> -<h1>Localization and automatic translation</h1> - -<p>Slidy now includes support for localization</p> - - "es":this.strings_es, - "ca":this.strings_ca, - "cs":this.strings_cs, - "nl":this.strings_nl, - "de":this.strings_de, - "pl":this.strings_pl, - "fr":this.strings_fr, - "hu":this.strings_hu, - "it":this.strings_it, - "el":this.strings_el, - "jp":this.strings_ja, - "zh":this.strings_zh, - "ru":this.strings_ru, - "sv":this.strings_sv - -<ul> -<li>The tool bar is localized according to the language of the presentation</li> -<li>This is taken from the xml:lang or lang attributes on the html element</li> -<li>The <a href="http://www.w3.org/Talks/Tools/Slidy2/help/help.html">help file</a> is -selected based upon your browser's language preferences</li> -<li>As of 29th July 2010, the languages supported are: English, -Spanish, Catalonian, Czech, Dutch, German, Polish, French, -Hungarian, Italian, Greek, Japanese, Chinese, Russian and -Swedish</li> -<li>If you would like to contribute localizations for other languages, -please get in touch with Dave Raggett <dsr@w3.org></li> -<li>The following illustrates what was used for Spanish</li> -</ul> -<pre> -// for each language there is an associative array - strings_es: { - "slide":"pág.", - "help?":"Ayuda", - "contents?":"Índice", - "table of contents":"tabla de contenidos", - "Table of Contents":"Tabla de Contenidos", - "restart presentation":"Reiniciar presentación", - "restart?":"Inicio" - }, - help_es: - "Utilice el ratón, barra espaciadora, teclas Izda/Dcha, " + - "o Re pág y Av pág. Use S y B para cambiar el tamaño de fuente.", -</pre> - -<p><strong>Note:</strong> Slidy now works with <a -href="http://translate.google.com/translate?js=n&prev=_t&hl=en&ie=UTF-8&u=http%3A%2F%2Fwww.w3.org%2FTalks%2FTools%2FSlidy2%2F&sl=en&tl=fr&history_state0=">current slides translated into French</a>. Use -right mouse button to open frame without Google header. To disable -automatic translation of the content of particular elements add -<code>class="notranslate"</code>, see <a href="http://googlewebmastercentral.blogspot.com/2008/10/helping-you-break-language-barrier.html">breaking the language barrier</a>.</p> -</div> - -<div class="slide"> -<h1>Future Plans</h1> - -<p>Recent additions have included a table of contents, and a way to -hide and reveal content in the spirit of outline lists. The -script has been rewritten to make it easier to combine with other -scripts, e.g. for UI controls, and support swipes for navigation on -touch screen devices. Further work is anticipated on the -following:</p> - -<ul> -<li>Collecting a gallery of good looking slide themes -<ul> -<li>Opportunities for graphics designers!</li> -</ul> -</li> -<li>Bob Ferris has worked on <a -href="https://github.com/zazi/slidy_tud/blob/master/README.md">a -number of UI extensions</a> which could be incorporated into the -W3C slidy script.</li> -<li>Getting SVG Tiny to work on IE without need for SVG plugin -<ul> -<li>Using scripts to dynamically convert SVG Tiny to VML</li> -<li>Note that IE9 introduces native SVG support, so it may -no longer be worth working on SVG to VML for rendering of SVG</li> -</ul> -</li> -<li>Pre-alpha version of wysiwyg slide editor (see <a -href="editor/editor-screenshot1.png">screenshot</a>) -<ul> -<li>Using contentEditable when available, otherwise -falling back to textarea and plain text conventions</li> -<li>Using XMLHttpRequest to dynamically reflect changes to server</li> -</ul> -</li> -<li>Mechanism for remotely driving Slidy as part of distributed meetings -<ul> -<li>Using XMLHttpRequest to listen for navigation commands</li> -<li>Using VoIP for accompanying audio and teleconferencing</li> -<li>Synchronizing recorded spoken presentation with currently viewed slide</li> -</ul> -</li> -<li>Filters from PowerPoint and Open Office -<ul> -<li>and export to PDF via <a href="http://www.princexml.com/">PrinceXML</a></li> -</ul> -</li> -</ul> - -<p>If you have comments, suggestions for improvements, or would -like to volunteer your help with further work on Slidy, -please contact <a href= -"http://www.w3.org/People/Raggett/">Dave Raggett</a> <<a href= -"mailto:dsr@w3.org">dsr@w3.org</a>></p> -</div> - -<div class="slide"> -<h1>Acknowledgements</h1> - -<ul> -<li>My thanks to everyone who sent in bug reports and feature -requests</li> -<li>Opera Software for implementing CSS @media projection and -promoting the idea of using the Web for presentations with -<a href="http://www.opera.com/support/tutorials/operashow/">Opera -Show</a></li> -<li><a href="http://tantek.com/">Tantek Çelik</a> for his -pioneering work on applying JavaScript for slide presentations on -other browsers</li> -<li>Eric Meyer for taking this further with the excellent <a -href="http://www.meyerweb.com/eric/tools/s5/s5-intro.html">S5</a></li> -<li>W3C's <a href="http://dev.w3.org/cvsweb/slidemaker/">slidemaker -tool</a>, which uses a perl script to split an html file up into -one file per slide with navigation buttons</li> -<li>Early versions of <a href="http://www.w3.org/People/Raggett/tidy/">HTML -Tidy</a> which supported a means to create presentations via splitting -html files on h2 elements</li> -<li>Many sites with advice on JavaScript work arounds for browser -variations</li> -<li>Microsoft for pioneering contentEditable and XMLHTTP which -both provide tremendous opportunities for Web applications</li> -<li>Microsoft Office which provided the impetus for creating -Slidy as a Web-based alternative to the ubiquitous use of PowerPoint</li> -</ul> - -<p class="smaller"><strong>Note</strong> that while Slidy and -S5 were developed independently, both support the use of the -class values "slide" and "handout" for div elements. Slidy doesn't -support the "layout" class featured in S5 and Opera Show, but -instead provides a more flexible alternative with the "background" -class, which enables different backgrounds on different slides.</p> -</div> - -<div class="slide"> -<h1>Acknowledgements</h1> - -<p>The following people have contributed localizations:</p> - -<ul> -<li>Emmanuelle Gutiérrez y Restrepo, Spanish</li> -<li>Joan V. Baz, Catalan</li> -<li>Jakub Vrána, Czech</li> -<li>Ruud Steltenpool, Dutch</li> -<li>Beat Vontobel, German</li> -<li>Krzysztof Kotowicz, Polish</li> -<li>Tamas Horvath, Hungarian</li> -<li>Creso Moraes, Brazilian Portuguese</li> -<li>Giuseppe Scollo, Italian</li> -<li>Konstantinos Koukopoulos, Greek</li> -<li>Yoshikazu Sawa (澤 義和), Japanese</li> -<li>Shelley Shyan, Chinese</li> -<li>Andrew Pantyukhin, Russian</li> -<li>Saasha Metsärantala, Swedish</li> -</ul> - -<p>The following people have contributed bug reports:</p> - -<ul> -<li>Ivan Herman</li> -<li>Steve Bratt</li> -<li>Peter Patel-Schneider</li> -<li>Matthew Coller</li> -<li>Rune Heggtveit</li> -<li>Gopal Venkatesan</li> -<li>Cay Horstmann</li> -<li>Schuyler Duveen</li> -<li>Matteo Nannini</li> -<li>Ralph Swick</li> -<li>Jakub Vrána</li> -<li>Philip Bolt</li> -<li>Jon Frost</li> -<li>Jonathan Chetwynd</li> -<li>Nicolas Frisby</li> -</ul> - -<p>Douglas Crockford for <a -href="http://www.crockford.com/javascript/jsmin.html">jsmin</a> -which was used to minify the script before compressing it with gzip.</p> -</div> -</body> -</html> |