Skip to content

Commit 9e8cbec

Browse files
committed
[css-transforms-2] Fix some reference errors
I couldn't work out how to fix the link errors to SVG 1.1's <animate> and <set> elements since SVG 1.1 and SVG Animation Elements don't appear to be indexed.
1 parent c9e71d5 commit 9e8cbec

File tree

1 file changed

+12
-9
lines changed

1 file changed

+12
-9
lines changed

css-transforms-2/Overview.bs

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,9 @@ spec:css-transforms-1;
3434
text: <transform-list>
3535
type: function;
3636
text: matrix()
37+
spec:css2;
38+
type: dfn;
39+
text: stacking context
3740
spec: infra
3841
type:dfn;
3942
text: list
@@ -65,15 +68,15 @@ Module Interactions {#module-interactions}
6568

6669
The <a>3D transform functions</a> here extend the set of functions for the 'transform' property.
6770

68-
Some values of 'perspective', 'transform-style' and 'backface-visibility' result in the creation of a [=containing block for all descendants=], and/or the creation of a <a spec="css21">stacking context</a>.
71+
Some values of 'perspective', 'transform-style' and 'backface-visibility' result in the creation of a [=containing block for all descendants=], and/or the creation of a <a>stacking context</a>.
6972

7073
Three-dimensional transforms affect the visual layering of elements, and thus override the back-to-front painting order described in <a href="https://www.w3.org/TR/CSS2/zindex.html">Appendix E</a> of [[!CSS21]].
7174

7275

7376
Terminology {#terminology}
7477
==========================
7578

76-
: <dfn>3D-transformed element</dfn>
79+
: <dfn>3D transformed element</dfn>
7780
:: An element whose computed value for the 'transform' property includes one of the <a>3D transform functions</a>
7881

7982
: <dfn>3D matrix</dfn>
@@ -277,16 +280,16 @@ The rendering of elements in a 3D rendering context is as follows (numbers refer
277280
<li>The content and descendant elements without 3D transforms, ordered according to steps 3—7, are rendered into a plane at z=0 relative to to the establishing element.
278281
<li>3D-transformed elements are each rendered into their own plane, transformed by the <a href="#accumulated-3d-transformation-matrix-computation">accumulated 3D transformation matrix</a>.
279282
<li>Intersection is performed between the set of planes generated by steps B and C, according to <a href="http://en.wikipedia.org/wiki/Newell%27s_algorithm">Newell's algorithm</a>.
280-
<li>The resulting set of planes is rendered on top of the backgrounds and box decorations rendered in this step A. Coplanar 3D transformed elements are rendered in painting order.
283+
<li>The resulting set of planes is rendered on top of the backgrounds and box decorations rendered in this step A. Coplanar [=3D transformed elements=] are rendered in painting order.
281284
</ol>
282285

283286
Issue: is it OK to not pop 2D-transformed elements into their own planes?
284287

285288
Issue: requiring intersection with non-transformed content and descendants requires UAs to allocate additional textures (possibly doubling memory use). Would be more efficient to simply render content and untransformed descendants along with background and borders.
286289

287-
Note that elements with transforms which have a negative z-component will render behind the content and untransformed descendants of the establishing element, and that 3D transformed elements may interpenetrate with content and untransformed elements.
290+
Note that elements with transforms which have a negative z-component will render behind the content and untransformed descendants of the establishing element, and that [=3D transformed elements=] may interpenetrate with content and untransformed elements.
288291

289-
Note: Because the 3D-transformed elements in a 3D rendering context can all depth-sort and intersect with each other, they are effectively rendered as if they were siblings. The effect of transform-style: preserve-3d can then be thought of as causing all the 3D transformed elements in a 3D rendering context to be hoisted up into the establishing element, but still rendered with their <a href="#accumulated-3d-transformation-matrix-computation">accumulated 3D transformation matrix</a>.
292+
Note: Because the 3D-transformed elements in a 3D rendering context can all depth-sort and intersect with each other, they are effectively rendered as if they were siblings. The effect of transform-style: preserve-3d can then be thought of as causing all the [=3D transformed elements=] in a 3D rendering context to be hoisted up into the establishing element, but still rendered with their <a href="#accumulated-3d-transformation-matrix-computation">accumulated 3D transformation matrix</a>.
290293

291294
<div class="example">
292295
<pre>
@@ -328,7 +331,7 @@ This example shows show elements in a 3D rendering context can intersect. The co
328331

329332
The ''perspective'' property can be used to ensure that 3D transformed elements in the resulting 3D rendering context appear to live in a common three-dimensional space with depth, by suppling a common perspective matrix to descendant transformed members of its 3D rendering context, which is taken into account in the <a href="#accumulated-3d-transformation-matrix-computation">accumulated 3D matrix computation</a>.
330333

331-
By default, elements with value for ''perspective'' other than ''perspective/none'' are flattening, and thus establish a 3D rendering context. However, setting ''transform-style'' to ''preserve-3d'' allows the perspective element to extend its containing 3D rendering context (provided no other <a href="#grouping-property-values">grouping property values</a> are in effect).
334+
By default, elements with value for ''perspective'' other than ''perspective/none'' are [=flattening element|flattening=], and thus establish a 3D rendering context. However, setting ''transform-style'' to ''preserve-3d'' allows the perspective element to extend its containing 3D rendering context (provided no other <a href="#grouping-property-values">grouping property values</a> are in effect).
332335

333336
<div class="example">
334337
<pre>
@@ -359,7 +362,7 @@ By default, elements with value for ''perspective'' other than ''perspective/non
359362
&lt;/div>
360363
</pre>
361364

362-
This example shows how nested 3D transforms are rendered. The blue div is transformed as in the previous example, with its rendering influenced by the perspective on its parent element. The lime element also has a 3D transform, which is a rotation about the X axis (anchored at the top, by virtue of the transform-origin). However, the lime element is being rendered into the plane of its parent because it is not a member of the same 3D rendering context; the parent is "flattening". Thus the lime element only appears shorter; it does not "pop out" of the blue element.
365+
This example shows how nested 3D transforms are rendered. The blue div is transformed as in the previous example, with its rendering influenced by the perspective on its parent element. The lime element also has a 3D transform, which is a rotation about the X axis (anchored at the top, by virtue of the transform-origin). However, the lime element is being rendered into the plane of its parent because it is not a member of the same 3D rendering context; the parent is [=flattening element|flattening=]. Thus the lime element only appears shorter; it does not "pop out" of the blue element.
363366

364367
<div class="figure">
365368
<img src="examples/3d-rendering-context-flat.png" width="240" height="200" alt="Nested 3D transforms, with flattening">
@@ -368,7 +371,7 @@ This example shows how nested 3D transforms are rendered. The blue div is transf
368371

369372
### Transformed element hierarchies ### {#transformed-element-hierarchies}
370373

371-
By default, <a>transformed elements</a> are flattening, and thus establish a <a>3D rendering context</a>. However, since it is useful to construct hierarchies of transformed objects that share a common 3-dimensional space, this flattening behavior may be overridden by specifying a value of ''preserve-3d'' for the ''transform-style'' property, provided no other <a href="#grouping-property-values">grouping property values</a> are in effect. This allows descendants of the transformed element to share the same 3D rendering context. Non-3D-transformed descendants of such elements are rendered into the plane of the element in step C above, but 3D-transformed elements in the same 3D rendering context will "pop out" into their own planes.
374+
By default, <a>transformed elements</a> are [=flattening element|flattening=], and thus establish a <a>3D rendering context</a>. However, since it is useful to construct hierarchies of transformed objects that share a common 3-dimensional space, this flattening behavior may be overridden by specifying a value of ''preserve-3d'' for the ''transform-style'' property, provided no other <a href="#grouping-property-values">grouping property values</a> are in effect. This allows descendants of the transformed element to share the same 3D rendering context. Non-3D-transformed descendants of such elements are rendered into the plane of the element in step C above, but 3D-transformed elements in the same 3D rendering context will "pop out" into their own planes.
372375

373376
<div class="example">
374377
<pre>
@@ -422,7 +425,7 @@ Note: as described here, the <a>accumulated 3D transformation matrix</a> takes i
422425

423426
Using three-dimensional transforms, it's possible to transform an element such that its reverse side is visible. 3D-transformed elements show the same content on both sides, so the reverse side looks like a mirror-image of the front side (as if the element were projected onto a sheet of glass). Normally, elements whose reverse side is towards the viewer remain visible. However, the 'backface-visibility' property allows the author to make an element invisible when its reverse side is towards the viewer. This behavior is "live"; if an element with ''backface-visibility: hidden'' were animating, such that its front and reverse sides were alternately visible, then it would only be visible when the front side were towards the viewer.
424427

425-
Visibility of the reverse side of an element is considered using the <a>accumulated 3D transformation matrix</a>, and is thus relative to the enclosing flattening element.
428+
Visibility of the reverse side of an element is considered using the <a>accumulated 3D transformation matrix</a>, and is thus relative to the enclosing [=flattening element=].
426429

427430
Note: This property is useful when you place two elements back-to-back, as you would to create a playing card. Without this property, the front and back elements could switch places at times during an animation to flip the card. Another example is creating a box out of 6 elements, but where you want to see only the inside faces of the box.
428431

0 commit comments

Comments
 (0)