[html5] r3825 - [e] (0) <details> example

[whatwg at whatwg.org]

Author: ianh
Date: 2009-09-13 04:23:29 -0700 (Sun, 13 Sep 2009)
New Revision: 3825

Modified:
   index
   source
Log:
[e] (0) <details> example

Modified: index
===================================================================
--- index	2009-09-13 11:06:17 UTC (rev 3824)
+++ index	2009-09-13 11:23:29 UTC (rev 3825)
@@ -38933,7 +38933,30 @@
 
   </div>
 
+  <div class=example>
 
+   <p>The following example shows the <code><a href=#the-details-element>details</a></code> element
+   being used to hide technical details in a progress report.</p>
+
+   <pre><section class="progress window">
+ <h1>Copying "Really Achieving Your Childhood Dreams"</h1>
+ <details>
+  <legend>Copying... <progress max="375505392" value="97543282"></progress> 25%</legend>
+  <dl>
+   <dt>Transfer rate:</dt> <dd>452KB/s</dd>
+   <dt>Local filename:</dt> <dd>/home/rpausch/raycd.m4v</dd>
+   <dt>Remote filename:</dt> <dd>/var/www/lectures/raycd.m4v</dd>
+   <dt>Duration:</dt> <dd>01:16:27</dd>
+   <dt>Color profile:</dt> <dd>SD (6-1-6)</dd>
+   <dt>Dimensions:</dt> <dd>320×240</dd>
+  </dl>
+ </details>
+</section></pre>
+
+  </div>
+
+
+
 <!-- v2DATAGRID
   <h4 id="datagrid">The <dfn><code>datagrid</code></dfn> element</h4>
 

Modified: source
===================================================================
--- source	2009-09-13 11:06:17 UTC (rev 3824)
+++ source	2009-09-13 11:23:29 UTC (rev 3825)
@@ -43686,7 +43686,30 @@
 
   </div>
 
+  <div class="example">
 
+   <p>The following example shows the <code>details</code> element
+   being used to hide technical details in a progress report.</p>
+
+   <pre><section class="progress window">
+ <h1>Copying "Really Achieving Your Childhood Dreams"</h1>
+ <details>
+  <legend>Copying... <progress max="375505392" value="97543282"></progress> 25%</legend>
+  <dl>
+   <dt>Transfer rate:</dt> <dd>452KB/s</dd>
+   <dt>Local filename:</dt> <dd>/home/rpausch/raycd.m4v</dd>
+   <dt>Remote filename:</dt> <dd>/var/www/lectures/raycd.m4v</dd>
+   <dt>Duration:</dt> <dd>01:16:27</dd>
+   <dt>Color profile:</dt> <dd>SD (6-1-6)</dd>
+   <dt>Dimensions:</dt> <dd>320×240</dd>
+  </dl>
+ </details>
+</section></pre>
+
+  </div>
+
+
+
 <!-- v2DATAGRID
   <h4 id="datagrid">The <dfn><code>datagrid</code></dfn> element</h4>