Clean up cursor property section.
--- a/master/interact.html Sun May 27 17:08:00 2012 +1000
+++ b/master/interact.html Sun May 27 17:45:43 2012 +1000
@@ -702,51 +702,45 @@
element</a>)</li>
</ul>
- <div class="propdef">
- <dl>
- <dt><span class="propdef-title property">'pointer-events'</span></dt>
- <dd>
- <table summary="pointer-events property" class="propinfo"
- cellspacing="0" cellpadding="0">
- <tr>
- <td><em>Value:</em> </td>
- <td>visiblePainted | visibleFill | visibleStroke |
- visible |<br />
- painted | fill | stroke | all | none | <a
- class="noxref"
- href="http://www.w3.org/TR/2008/REC-CSS2-20080411/cascade.html#value-def-inherit">
- <span
- class="value-inst-inherit noxref">inherit</span></a></td>
- </tr>
- <tr>
- <td><em>Initial:</em> </td>
- <td>visiblePainted</td>
- </tr>
- <tr>
- <td><em>Applies to:</em> </td>
- <td><a>graphics elements</a></td>
- </tr>
- <tr>
- <td><em>Inherited:</em> </td>
- <td>yes</td>
- </tr>
- <tr>
- <td><em>Percentages:</em> </td>
- <td>N/A</td>
- </tr>
- <tr>
- <td><em>Media:</em> </td>
- <td>visual</td>
- </tr>
- <tr>
- <td><em><a
- href="animate.html#Animatable">Animatable</a>:</em> </td>
- <td>yes</td>
- </tr>
- </table>
- </dd>
- </dl>
- </div>
+<table class="propdef">
+ <tr>
+ <th>Name:</th>
+ <td><dfn id="PointerEventsProperty">pointer-events</dfn></td>
+ </tr>
+ <tr>
+ <th>Value:</th>
+ <td>visiblePainted | visibleFill | visibleStroke | visible | painted |
+ fill | stroke | all | none</td>
+ </tr>
+ <tr>
+ <th>Initial:</th>
+ <td>visiblePainted</td>
+ </tr>
+ <tr>
+ <th>Applies to:</th>
+ <td><a>graphics elements</a> and <a>text content child elements</a></td>
+ </tr>
+ <tr>
+ <th>Inherited:</th>
+ <td>yes</td>
+ </tr>
+ <tr>
+ <th>Percentages:</th>
+ <td>N/A</td>
+ </tr>
+ <tr>
+ <th>Media:</th>
+ <td>visual</td>
+ </tr>
+ <tr>
+ <th>Computed value:</th>
+ <td>as specified</td>
+ </tr>
+ <tr>
+ <th><a href="animate.html#Animatable">Animatable</a>:</th>
+ <td>yes</td>
+ </tr>
+</table>
<dl>
<dt><span class="prop-value">visiblePainted</span></dt>
@@ -956,118 +950,31 @@
a <a>'cursor element'</a> element, which can be
used to define a platform-independent cursor.</p>
+<div class="ready-for-wg-review">
<h3 id="CursorProperty">The <span class="property">'cursor'</span> property</h3>
- <div class="propdef">
- <dl>
- <dt><span class="propdef-title property">'cursor'</span></dt>
- <dd>
- <table summary="cursor property" class="propinfo"
- cellspacing="0" cellpadding="0">
- <tr>
- <td><em>Value:</em> </td>
- <td>[ [<a
- href="types.html#DataTypeFuncIRI"><FuncIRI></a> ,]* [
- auto | crosshair | default | pointer | move |
- e-resize | ne-resize | nw-resize | n-resize |
- se-resize | sw-resize | s-resize | w-resize| text |
- wait | help ] ] | <a class="noxref"
- href="http://www.w3.org/TR/2008/REC-CSS2-20080411/cascade.html#value-def-inherit">
- <span
- class="value-inst-inherit noxref">inherit</span></a></td>
- </tr>
- <tr>
- <td><em>Initial:</em> </td>
- <td>auto</td>
- </tr>
- <tr>
- <td><em>Applies to:</em> </td>
- <td><a>container elements</a> and
- <a>graphics elements</a></td>
- </tr>
- <tr>
- <td><em>Inherited:</em> </td>
- <td>yes</td>
- </tr>
- <tr>
- <td><em>Percentages:</em> </td>
- <td>N/A</td>
- </tr>
- <tr>
- <td><em>Media:</em> </td>
- <td>visual, interactive</td>
- </tr>
- <tr>
- <td><em><a
- href="animate.html#Animatable">Animatable</a>:</em> </td>
- <td>yes</td>
- </tr>
- </table>
- </dd>
- </dl>
- </div>
-
-<p>This property specifies the type of cursor to be displayed
-for the pointing device. Values have the following
-meanings:</p>
+<p class="note">See the CSS Basic User Interface Module Level 3 specification
+for the definition of <a>'cursor property'</a>. [<a href="refs.html#ref-CSS3UI">CSS3UI</a>]</p>
-<dl>
- <dt><span class='attr-value'>auto</span></dt>
- <dd>The UA determines the cursor to display based on the current context.</dd>
-
- <dt><span class='attr-value'>crosshair</span></dt>
- <dd>A simple crosshair (e.g., short line segments resembling a "+" sign).</dd>
-
- <dt><span class='attr-value'>default</span></dt>
- <dd>The platform-dependent default cursor. Often rendered as an arrow.</dd>
-
- <dt><span class='attr-value'>pointer</span></dt>
- <dd>The cursor is a pointer that indicates a link.</dd>
-
- <dt><span class='attr-value'>move</span></dt>
- <dd>Indicates something is to be moved.</dd>
-
- <dt><span class='attr-value'>e-resize, ne-resize, nw-resize, n-resize,
- se-resize, sw-resize, s-resize, w-resize</span></dt>
-
- <dd>Indicate that some edge is to be moved. For example, the
- 'se-resize' cursor is used when the movement starts from the
- south-east corner of the box.</dd>
-
- <dt><span class='attr-value'>text</span></dt>
- <dd>Indicates text that can be selected. Often rendered as an
- I-bar.</dd>
+<p>SVG uses the <a>'cursor property'</a> property to specify the type of cursor to
+be displayed for the pointing device when it is over a region of an
+element that is sensitive to pointer events, according to the value of
+the <a>'pointer-events'</a> property. SVG extends the definition of
+<a>'cursor property'</a> from the CSS Basic User Interface Module Level 3
+specification as follows:</p>
- <dt><span class='attr-value'>wait</span></dt>
- <dd>Indicates that the program is busy. Often rendered as a
- watch or hourglass.</dd>
-
- <dt><span class='attr-value'>help</span></dt>
- <dd>Help is available for the object under the cursor. Often
- rendered as a question mark or a balloon.</dd>
+<ul>
+ <li>All <uri> values in the definition of the property are
+ instead parsed as <a><funciri></a> values.</li>
- <dt><span class='attr-value'><FuncIRI></span></dt>
- <dd>The user agent retrieves the cursor from the resource
- designated by the URI. If the user agent cannot handle the
- first cursor of a list of cursors, it shall attempt to handle
- the second, etc. If the user agent cannot handle any
- user-defined cursor, it must use the generic cursor at the
- end of the list.</dd>
-</dl>
-
-<div class="example">
-<pre>
-text { cursor: url("mything.cur"), url("second.svg#curs"), text; }
-</pre>
+ <li>The SVG implementation must support an <a><funciri></a> value
+ being an IRI reference to an SVG <a>'cursor element'</a> element.
+ If the <x> and <y> values are given for a <a><funciri></a>
+ that refers to a <a>'cursor element'</a>, they override its
+ <a>'cursor/x'</a> and <a>'cursor/y'</a> attributes.</li>
+</ul>
</div>
-<p>The <a>'cursor property'</a> property for SVG
-is identical to the <a href="http://www.w3.org/TR/2008/REC-CSS2-20080411/ui.html#propdef-cursor"><span class="property">'cursor'</span>
-property defined in CSS2</a> ([<a href="refs.html#ref-CSS2">CSS2</a>], section
-18.1), with the additional requirement that SVG user agents must support cursors
-defined by the SVG <a>'cursor element'</a> element. This gives a single, cross-platform,
-interoperable cursor format, with PNG as the raster component.</p>
-
<h3 id="CursorElement">The <span class="element-name">'cursor'</span> element</h3>
<edit:with element='cursor'>
@@ -1136,6 +1043,8 @@
targets of the <a>'xlink:href'</a>
attribute.</p>
+<p class="issue">Add an example.</p>
+
</edit:with>
<h2 id="DOMInterfaces">DOM interfaces</h2>