User Tools

Site Tools


sugarcane_html

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
sugarcane_html [2014/03/19 07:25]
l
sugarcane_html [2017/10/09 20:39] (current)
Line 1: Line 1:
-=====Sugarcane HTML structure=====+======Sugarcane HTML structure======
  
-The HTML structure of the **Sugarcane** [[Story format]] looks like this:+As a reference for those writing [[stylesheet]]s,​ the HTML structure of the **Sugarcane** [[Story format]] looks like this:
  
     <body data-tags="">​     <body data-tags="">​
Line 14: Line 14:
         </li>         </li>
         <li id="​storyMenu"​ class="​storyElement"​ style="​display:​none"></​li>​         <li id="​storyMenu"​ class="​storyElement"​ style="​display:​none"></​li>​
 +        <li id="​snapback">​Rewind</​li>​
         <li id="​restart">​Restart</​li>​         <li id="​restart">​Restart</​li>​
         <li>         <li>
Line 37: Line 38:
       </​div>​       </​div>​
     </​body>​     </​body>​
 +    ​
 +Some notes:
 +  * Both the body element and the .passage element'​s data-tags attribute reflects the tags of the current passage. This was originally used just as a CSS hook, before the advent of tagged stylesheets in version 1.4.0.
 +  * The #​titleSeparator,​ .header and .footer elements are unused by Twine'​s normal operations, but can be styled in any manner you like. .body.content contains all the rendered HTML of the passage.
 +  * #snapback is not present when no passage in the story is [[tag|tagged]] "​bookmark"​.
 +  * #​snapbackMenu is the floating menu that appears when you use the Rewind button.
 +  * When a different passage is displayed, a .passage div and its contents (.header, .footer and .content) are recreated anew and inserted into the #passages div.
 +  * During transitions,​ the #passages div contains the old passage (which transitions toward the styles assigned to .transition-out) and the new passage (which transitions from the styles assigned to .transition-in)
sugarcane_html.1395228327.txt.gz ยท Last modified: 2017/10/09 20:38 (external edit)