Slidy backend for AsciiDoc ========================== :author: Stuart Rackham :backend: slidy :max-width: 45em :data-uri: :icons: Use the following command to create this document (`slidy.html`): asciidoc slidy.txt Press the 'Space' key or the 'Left Arrow' key to continue the slideshow. Overview -------- AsciiDoc has a 'slidy' backend for generating self contained 'Slidy' HTML slideshows. - An overview of 'Slidy' can be found here: https://www.w3.org/Talks/Tools/Slidy2 - AsciiDoc ships with the Slidy JavaScript a customised Slidy CSS file. - Use the 'asciidoc' `--backend slidy` command-line option to generate browser viewable HTML slideshow. Example: asciidoc --backend slidy slidy-example.txt - By default, 'asciidoc' creates a self contained distributable HTML document which includes all necessary CSS and JavaScripts. Use the 'asciidoc' `--attribute linkcss` command-line option if you prefer to link (rather than embed) external CSS and JavaScript files. How Slidy uses AsciiDoc markup ------------------------------ - The document header is displayed as the first page of the slideshow. - If the document has a 'preamble' (the content between the header and the first section) it will be displayed on the second page. - Each top level section is displayed as a separate slide. - If the AsciiDoc 'incremental' attribute is defined then all lists and OpenBlock elements are treated as 'incremental' i.e. Slidy exposes their child elements one at a time as you progress through the slideshow. - You can explicitly set an element as incremental by setting its 'role' attribute to 'incremental'. Example: [role="incremental"] Sagittis in vestibulum. Habitasse ante nulla enim bibendum nulla. Odio sed pede litora. Slidy Specific Attributes ------------------------- incremental:: If this attribute is defined then all lists and OpenBlock elements are classed as incremental i.e. Slidy will expose them one at a time as you progress through the slideshow. The default behavior is for the show to progress a full slide at at time. Elements that have been explicitly classed as 'incremental' with the 'role' attribute are always displayed incrementally. duration:: Set this to the estimated number of minutes that your presentation will take and Slidy will display a countdown timer at the bottom right of the slideshow. For example, this 'asciidoc' command-line option `--attribute duration=5` sets the duration to five minutes. copyright:: If you set the 'copyright' attribute it will be displayed in the Slidy menu bar at the bottom of the slide. If the 'copyright' attribute is not define then the author name, if it is defined, will be displayed. outline:: Setting the 'role' attribute to 'outline' in a bulleted or numbered list allows nested lists to be expanded and collapsed using the mouse. Nested lists are expanded when an enclosing list item (the ones with blue bullet points or numbers) is clicked. Stylesheets ----------- - 'slidy' loads the 'asciidoc.css' stylesheet followed by 'slidy.css': * `asciidoc.css` contains content presentational styles. * The customized `slidy.css` stylesheet contains Slidy specific styles (table of contents, menu and transition related). - You can use AsciiDoc CSS themes. For example, the 'asciidoc' `--attribute theme=volnitsky` command-line option will substitute the `asciidoc.css` stylesheet for the distributed Volnitsky `volnitsky.css` stylesheet. - An additional stylesheet can be specified by setting the 'stylesheet' attribute. For example, the `--attribute stylesheet=myslidy.css` will load `myslidy.css` after the standard CSS files. Tips ---- - The Slidy 'help?' and 'contents?' links at the bottom left are your friends. - Use the AsciiDoc 'data-uri' attribute to embed images in your slideshow -- add this attribute entry to your document's header: :data-uri: - Use the AsciiDoc 'max-width' attribute to set the document display width. For example, add this attribute entry to your document's header: :max-width: 45em