- From: Dirk Schulze via cvs-syncmail <cvsmail@w3.org>
- Date: Tue, 24 Jan 2012 23:08:07 +0000
- To: public-css-commits@w3.org
Update of /sources/public/csswg/css3-transforms
In directory hutz:/tmp/cvs-serv29598
Modified Files:
Overview.html Transforms.src.html
Log Message:
- Auto creation of links doesn't correctly link to CSS Transforms spec. Reverted string 'css-transforms' to 'css-2d-transform' string for now.
- Upload created Overview.html document as well.
- Added Vincent Hardy and Dirk Schulze as editors.
Index: Overview.html
===================================================================
RCS file: /sources/public/csswg/css3-transforms/Overview.html,v
retrieving revision 1.5
retrieving revision 1.6
diff -u -d -r1.5 -r1.6
--- Overview.html 28 Nov 2011 20:10:02 -0000 1.5
+++ Overview.html 24 Jan 2012 23:08:05 -0000 1.6
@@ -77,6 +77,22 @@
font-size: 120%;
color: red;
}
+
+ dt, dd { margin-top: 0; margin-bottom: 0 } /* opera 3.50 */
+ dt { font-weight: bold }
+
+ .todo {
+ font-weight: bold;
+ border-left: 0.5em solid #f44;
+ padding-left: 1em;
+ margin-top: 0.5em;
+ color: #a0a0a0;
+ }
+
+ .todo:before {
+ content: "TO DO : ";
+ color: #f44;
+ }
</style>
<body>
@@ -86,15 +102,15 @@
<h1>CSS transforms</h1>
- <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 28 November
- 2011</h2>
+ <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 24 January
+ 2012</h2>
<dl>
<dt>This version:
<dd> <a
- href="http://www.w3.org/TR/2011/ED-css3-2d-transforms-20111128/">http://dev.w3.org/csswg/css3-2d-transforms/</a>
- <!--http://www.w3.org/TR/2011/WD-css3-2d-transforms-20111128-->
+ href="http://www.w3.org/TR/2012/ED-css3-2d-transforms-20120124/">http://dev.w3.org/csswg/css3-2d-transforms/</a>
+ <!--http://www.w3.org/TR/2012/WD-css3-2d-transforms-20120124-->
<dt>Latest version:
@@ -123,11 +139,17 @@
<dd>Edward O'Connor (<a href="http://www.apple.com/">Apple Inc</a>)
<eoconnor @apple.com>
+
+ <dd>Vincent Hardy (<a href="http://www.adobe.com/">Adobe Systems,
+ Inc</a>) <vhardy @adobe.com>
+
+ <dd>Dirk Schulze (<a href="http://www.adobe.com/">Adobe Systems, Inc</a>)
+ <dschulze @adobe.com>
</dl>
<!--begin-copyright-->
<p class=copyright><a
href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"
- rel=license>Copyright</a> © 2011 <a
+ rel=license>Copyright</a> © 2012 <a
href="http://www.w3.org/"><acronym
title="World Wide Web Consortium">W3C</acronym></a><sup>®</sup> (<a
href="http://www.csail.mit.edu/"><acronym
@@ -150,7 +172,7 @@
<p><strong>THIS IS A WORK IN PROGRESS AND NOT READY FOR REVIEW.</strong>
<p>CSS transforms allows elements styled with CSS to be transformed in
- two-dimensional or three=dimensional space. This specification is the
+ two-dimensional or three-dimensional space. This specification is the
convergence of the <a href="http://www.w3.org/TR/css3-2d-transforms/">CSS
2D transforms</a>, <a href="http://www.w3.org/TR/css3-3d-transforms/">CSS
3D transforms</a> and <a
@@ -201,59 +223,67 @@
<ul class=toc>
<li><a href="#introduction"><span class=secno>1. </span>Introduction</a>
- <li><a href="#transform-property"><span class=secno>2. </span> The <span
+ <li><a href="#definitions"><span class=secno>2. </span> Definitions </a>
+
+ <li><a href="#transform-property"><span class=secno>3. </span> The <span
class=prop-name>‘<code
class=property>transform</code>’</span> Property </a>
<ul class=toc>
- <li><a href="#svg-transform"><span class=secno>2.1. </span>The SVG
+ <li><a href="#svg-transform"><span class=secno>3.1. </span>The SVG
transform attribute</a>
<ul class=toc>
<li><a href="#transform-attribute-specificity"><span
- class=secno>2.1.1. </span>SVG transform attribute specificity</a>
+ class=secno>3.1.1. </span>SVG transform attribute specificity</a>
- <li><a href="#transform-attribute-dom"><span class=secno>2.1.2.
+ <li><a href="#transform-attribute-dom"><span class=secno>3.1.2.
</span>SVG transform attribute DOM</a>
</ul>
</ul>
- <li><a href="#transform-origin-property"><span class=secno>3. </span> The
+ <li><a href="#transform-origin-property"><span class=secno>4. </span> The
<span class=prop-name>‘<code
class=property>transform-origin</code>’</span> Property </a>
<ul class=toc>
- <li><a href="#svg-transform-origin"><span class=secno>3.1. </span>The
+ <li><a href="#svg-transform-origin"><span class=secno>4.1. </span>The
‘<code class=property>transform-origin</code>’ property for
SVG elements</a>
</ul>
- <li><a href="#transform-functions"><span class=secno>4. </span> The
+ <li><a href="#transform-functions"><span class=secno>5. </span> The
Transformation Functions </a>
- <li><a href="#transform-values"><span class=secno>5. </span> Transform
+ <li><a href="#transform-values"><span class=secno>6. </span> Transform
Values and Lists </a>
- <li><a href="#animation"><span class=secno>6. </span> Transitions and
+ <li><a href="#animation"><span class=secno>7. </span> Transitions and
animations between transform values </a>
- <li><a href="#matrix-decomposition"><span class=secno>7. </span> Matrix
+ <li><a href="#matrix-decomposition"><span class=secno>8. </span> Matrix
decomposition for animation </a>
<ul class=toc>
- <li><a href="#unmatrix"><span class=secno>7.1. </span>Unmatrix</a>
+ <li><a href="#unmatrix"><span class=secno>8.1. </span>Unmatrix</a>
- <li><a href="#animating-the-components"><span class=secno>7.2.
+ <li><a href="#animating-the-components"><span class=secno>8.2.
</span>Animating the components</a>
- <li><a href="#recomposing-the-matrix"><span class=secno>7.3.
+ <li><a href="#recomposing-the-matrix"><span class=secno>8.3.
</span>Recomposing the matrix</a>
</ul>
- <li><a href="#dom-interfaces"><span class=secno>8. </span> DOM Interfaces
+ <li><a href="#dom-interfaces"><span class=secno>9. </span> DOM Interfaces
</a>
<ul class=toc>
- <li><a href="#cssmatrix-interface"><span class=secno>8.1. </span>
+ <li><a href="#cssmatrix-interface"><span class=secno>9.1. </span>
CSSMatrix </a>
</ul>
- <li><a href="#references"><span class=secno>9. </span>References</a>
+ <li><a href="#changes"><span class=secno>10. </span>Changes</a>
+ <ul class=toc>
+ <li><a href="#changes_from_January_24_2012"><span class=secno>10.1.
+ </span> Changes from January 24<sup>th</sup> 2012 version </a>
+ </ul>
+
+ <li><a href="#references"><span class=secno>11. </span>References</a>
<ul class=toc>
<li class=no-num><a href="#normative-references">Normative
references</a>
@@ -277,19 +307,21 @@
thought of as being expressed in pixels, starting in the upper left corner
of the parent with positive values proceeding to the right and down.
+ <p class=todo> Need to mention the perspective transform to give a sense of
+ depth.
+
<p> This coordinate space can be modified with the <span
class=prop-name>‘<a href="#effects"><code
class=property>transform</code></a>’</span> property. Using
- transform, elements can be translated, rotated and scaled in two
+ transform, elements can be translated, rotated and scaled in two or three
dimensional space. The coordinate space behaves as described in the <a
href="http://www.w3.org/TR/SVG/coords.html#EstablishingANewUserSpace">coordinate
system transformations</a> section of the SVG 1.1 specification. This is a
coordinate system with two axes: the X axis increases horizontally to the
right; the Y axis increases vertically downwards.
- <p> Transforms apply to block-level and atomic inline-level elements, but
- do not apply to elements which may be split into multiple inline-level
- boxes.
+ <p> Transforms apply to <a href="#TermTransformableElement">transformable
+ elements</a>.
<p> Specifying a value other than ‘<code
class=property>none</code>’ for the <span class=prop-name>‘<a
@@ -320,9 +352,9 @@
containing block. The object acts as a containing block for fixed
positioned descendants.
- <div class=todo> Need to go into more detail here about why fixed
- positioned objects should do this, i.e., that it's much harder to
- implement otherwise.</div>
+ <p class=todo> Need to go into more detail here about why fixed positioned
+ objects should do this, i.e., that it's much harder to implement
+ otherwise.
<div class=issue> There are two roles for transformations in layout: (1)
transformations that adjust the position of the affected content without
@@ -345,7 +377,27 @@
can be viewed in its original form.</div>
<!-- ======================================================================================================= -->
- <h2 id=transform-property><span class=secno>2. </span> The <span
+ <h2 id=definitions><span class=secno>2. </span> Definitions</h2>
+
+ <p> When used in this specification, terms have the meanings assigned in
+ this section.
+
+ <dl>
+ <dt id=TermTransformableElement> <span class=termDefine>transformable
+ element</span>
+
+ <dd>
+ <p> A transformable element can either be a block-level or atomic
+ inline-level element, not splitted into multiple inline-level boxes,
+ from the HTML namespace, or an element which has the attributes
+ ‘<a href="#effects"><code
+ class=property>transform</code></a>’, ‘<code
+ class=property>patternTransform</code>’ or ‘<code
+ class=property>gradientTransform</code>’ in the SVG namespace (see
+ <a href="#SVG11" rel=biblioentry>[SVG11]<!--{{SVG11}}--></a>).</p>
+ </dl>
+
+ <h2 id=transform-property><span class=secno>3. </span> The <span
class=prop-name>‘<a href="#effects"><code
class=property>transform</code></a>’</span> Property</h2>
@@ -379,7 +431,7 @@
<tr>
<td> <em>Applies to:</em>
- <td> block-level and atomic inline-level elements
+ <td> <a href="#TermTransformableElement">transformable elements</a>
<tr>
<td> <em>Inherited:</em>
@@ -403,7 +455,7 @@
</table>
<!-- ======================================================================================================= -->
- <h3 id=svg-transform><span class=secno>2.1. </span>The SVG transform
+ <h3 id=svg-transform><span class=secno>3.1. </span>The SVG transform
attribute</h3>
<p>The <a href="http://www.w3.org/TR/2011/REC-SVG11-20110816/">SVG 1.1
@@ -417,7 +469,7 @@
href="#effects"><code class=property>transform</code></a>’ property
one that applies to SVG elements.
- <h4 id=transform-attribute-specificity><span class=secno>2.1.1. </span>SVG
+ <h4 id=transform-attribute-specificity><span class=secno>3.1.1. </span>SVG
transform attribute specificity</h4>
<p>Since the SVG attribute becomes a presentation attribute, its
@@ -426,7 +478,7 @@
href="http://www.w3.org/TR/2011/REC-SVG11-20110816/styling.html#UsingPresentationAttributes">explained</a>
in the SVG specification.
- <h4 id=transform-attribute-dom><span class=secno>2.1.2. </span>SVG
+ <h4 id=transform-attribute-dom><span class=secno>3.1.2. </span>SVG
transform attribute DOM</h4>
<p>The SVG specification <a
@@ -457,7 +509,7 @@
</ul>
</div>
- <h2 id=transform-origin-property><span class=secno>3. </span> The <span
+ <h2 id=transform-origin-property><span class=secno>4. </span> The <span
class=prop-name>‘<a href="#transform-origin"><code
class=property>transform-origin</code></a>’</span> Property</h2>
@@ -518,7 +570,7 @@
<tr>
<td> <em>Applies to:</em>
- <td> block-level and atomic inline-level elements
+ <td> <a href="#TermTransformableElement">transformable element</a>
<tr>
<td> <em>Inherited:</em>
@@ -541,7 +593,7 @@
<td> For <length> the absolute value, otherwise a percentage
</table>
- <h3 id=svg-transform-origin><span class=secno>3.1. </span>The ‘<a
+ <h3 id=svg-transform-origin><span class=secno>4.1. </span>The ‘<a
href="#transform-origin"><code
class=property>transform-origin</code></a>’ property for SVG
elements</h3>
@@ -558,7 +610,7 @@
</pre>
<!-- ======================================================================================================= -->
- <h2 id=transform-functions><span class=secno>4. </span> The Transformation
+ <h2 id=transform-functions><span class=secno>5. </span> The Transformation
Functions</h2>
<p> The value of the <a class=prop-name href="#effects">transform</a>
@@ -645,7 +697,7 @@
transformation along the Y axis</a> by the given angle.
</dl>
- <h2 id=transform-values><span class=secno>5. </span> Transform Values and
+ <h2 id=transform-values><span class=secno>6. </span> Transform Values and
Lists</h2>
<p> The <translation-value> values are defined as [<percentage>
@@ -704,7 +756,7 @@
</div>
<!-- ======================================================================================================= -->
- <h2 id=animation><span class=secno>6. </span> Transitions and animations
+ <h2 id=animation><span class=secno>7. </span> Transitions and animations
between transform values</h2>
<p> When animating or transitioning the value of a transform property the
@@ -789,7 +841,7 @@
from 1 to -1. At the time when the matrix is in such a state, the
transformed element is not rendered.
- <h2 id=matrix-decomposition><span class=secno>7. </span> Matrix
+ <h2 id=matrix-decomposition><span class=secno>8. </span> Matrix
decomposition for animation</h2>
<p> When interpolating between 2 matrices, each is decomposed into the
@@ -799,7 +851,7 @@
technique below. This technique is taken from The "unmatrix" method in
"Graphics Gems II, edited by Jim Arvo", simplified for the 2D case.
- <h3 id=unmatrix><span class=secno>7.1. </span>Unmatrix</h3>
+ <h3 id=unmatrix><span class=secno>8.1. </span>Unmatrix</h3>
<pre>
Input: a, b, c, d ; 2x2 matrix (rotate, scale, shear) components
@@ -856,7 +908,7 @@
return true;</pre>
- <h3 id=animating-the-components><span class=secno>7.2. </span>Animating the
+ <h3 id=animating-the-components><span class=secno>8.2. </span>Animating the
components</h3>
<p> Once decomposed, each component of each returned value of the source
@@ -865,7 +917,7 @@
are interpolated numerically, and the result is used to set the
translation of the animating element.
- <h3 id=recomposing-the-matrix><span class=secno>7.3. </span>Recomposing the
+ <h3 id=recomposing-the-matrix><span class=secno>8.3. </span>Recomposing the
matrix</h3>
<p><em>This section is not normative.</em>
@@ -887,12 +939,12 @@
document.getElementById(elementID).style.transform = s;
}</pre>
- <h2 id=dom-interfaces><span class=secno>8. </span> DOM Interfaces</h2>
+ <h2 id=dom-interfaces><span class=secno>9. </span> DOM Interfaces</h2>
<p> This section describes the interfaces and functionality added to the
DOM to support runtime access to the functionality described above.
- <h3 id=cssmatrix-interface><span class=secno>8.1. </span> CSSMatrix</h3>
+ <h3 id=cssmatrix-interface><span class=secno>9.1. </span> CSSMatrix</h3>
<div class="issue issue-marker">
<p class=desc>We actually describe a 3x2 matrix here, similar to <a
@@ -1269,7 +1321,38 @@
matrix that is the result of applying the individual functions listed in
the <a href="#effects"><code>transform</code></a> property.
- <h2 id=references><span class=secno>9. </span>References</h2>
+ <h2 id=changes><span class=secno>10. </span>Changes</h2>
+
+ <h3 id="changes_from_January_24_2012"><span class=secno>10.1. </span>
+ Changes from <a
+ href="http://www.w3.org/TR/2012/ED-css3-2d-transforms-20110124/">January
+ 24<sup>th</sup> 2012</a> version</h3>
+
+ <ul>
+ <li> Corrected typing errors in introduction.
+
+ <li> Mention three dimensional space in introduction.
+
+ <li> Added TODO for adding perspective transform in introduction.
+
+ <li> Added new section ‘<code
+ class=property>Definitions</code>’ for terms used in this document.
+
+
+ <li> Copied style setting for term descriptions from the ‘<code
+ class=css>Filter Effects 1.0</code>’ specification.
+
+ <li> Introduced new term ‘<code class=css>transformable
+ element</code>’ and added description to the ‘<code
+ class=property>Description</code>’ section.
+
+ <li> Added new section ‘<code class=property>Changes</code>’
+ for changes to this document.
+
+ <li> Added Vincent Hardy and Dirk Schulze as editors.
+ </ul>
+
+ <h2 id=references><span class=secno>11. </span>References</h2>
<h3 class=no-num id=normative-references>Normative references</h3>
<!--begin-normative-->
@@ -1288,6 +1371,16 @@
<dl class=bibliography>
<dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
<!---->
+
+ <dt id=SVG11>[SVG11]
+
+ <dd>Erik Dahlström; et al. <a
+ href="http://www.w3.org/TR/2011/REC-SVG11-20110816/"><cite>Scalable
+ Vector Graphics (SVG) 1.1 (Second Edition).</cite></a> 16 August 2011.
+ W3C Recommendation. URL: <a
+ href="http://www.w3.org/TR/2011/REC-SVG11-20110816/">http://www.w3.org/TR/2011/REC-SVG11-20110816/</a>
+ </dd>
+ <!---->
</dl>
<!--end-informative-->
@@ -1319,7 +1412,7 @@
<td>none
- <td>block-level and atomic inline-level elements
+ <td>transformable elements
<td>no
@@ -1338,7 +1431,7 @@
<td>50% 50%
- <td>block-level and atomic inline-level elements
+ <td>transformable element
<td>no
@@ -1352,10 +1445,10 @@
<!--begin-index-->
<ul class=indexlist>
- <li>transform, <a href="#effects" title=transform><strong>2.</strong></a>
+ <li>transform, <a href="#effects" title=transform><strong>3.</strong></a>
<li>transform-origin, <a href="#transform-origin"
- title=transform-origin><strong>3.</strong></a>
+ title=transform-origin><strong>4.</strong></a>
</ul>
<!--end-index-->
</html>
Index: Transforms.src.html
===================================================================
RCS file: /sources/public/csswg/css3-transforms/Transforms.src.html,v
retrieving revision 1.7
retrieving revision 1.8
diff -u -d -r1.7 -r1.8
--- Transforms.src.html 24 Jan 2012 22:38:30 -0000 1.7
+++ Transforms.src.html 24 Jan 2012 23:08:05 -0000 1.8
@@ -104,7 +104,7 @@
<dl>
<dt>This version:
<dd>
- <a href="[VERSION]">http://dev.w3.org/csswg/css3-transforms/</a>
+ <a href="[VERSION]">http://dev.w3.org/csswg/css3-2d-transforms/</a>
<!--http://www.w3.org/TR/[YEAR]/WD-[SHORTNAME]-[CDATE]-->
<dt>Latest version:
<dd><a
@@ -118,6 +118,8 @@
<dd>David Hyatt (<a href="http://www.apple.com/">Apple Inc</a>) <hyatt @apple.com>
<dd>Chris Marrin (<a href="http://www.apple.com/">Apple Inc</a>) <cmarrin @apple.com>
<dd>Edward O'Connor (<a href="http://www.apple.com/">Apple Inc</a>) <eoconnor @apple.com>
+ <dd>Vincent Hardy (<a href="http://www.adobe.com/">Adobe Systems, Inc</a>) <vhardy @adobe.com>
+ <dd>Dirk Schulze (<a href="http://www.adobe.com/">Adobe Systems, Inc</a>) <dschulze @adobe.com>
</dl>
<!--copyright-->
@@ -1237,13 +1239,10 @@
<h2 id="changes">Changes</h2>
<h3 id="changes_from_January_24_2012">
- Changes from <a href="http://www.w3.org/TR/2012/WD-css3-transforms-20110124/">January 24<sup>th</sup> 2012</a> version
+ Changes from <a href="http://www.w3.org/TR/2012/ED-css3-2d-transforms-20110124/">January 24<sup>th</sup> 2012</a> version
</h3>
<ul>
<li>
- 'This version' links to the current version of this specification instead of CSS3 2D Transforms now.
- </li>
- <li>
Corrected typing errors in introduction.
<li>
Mention three dimensional space in introduction.
@@ -1263,6 +1262,9 @@
<li>
Added new section 'Changes' for changes to this document.
</li>
+ <li>
+ Added Vincent Hardy and Dirk Schulze as editors.
+ </li>
</ul>
Received on Tuesday, 24 January 2012 23:08:14 UTC