/[suikacvs]/www/test/css/trident/expression/pseudo-hover.html
Suika

Diff of /www/test/css/trident/expression/pseudo-hover.html

Parent Directory Parent Directory | Revision Log Revision Log | View Patch Patch

revision 1.1 by wakaba, Tue May 24 01:34:29 2005 UTC revision 1.2 by wakaba, Tue May 24 01:39:00 2005 UTC
# Line 30  li.hover { Line 30  li.hover {
30  </ul>  </ul>
31  </div>  </div>
32    
33  <div class="section" id="STYLE">  <div class="section" id="SOURCE">
34  <h2>Style Sheet Fragment</h2>  <h2>Source</h2>
35    
36  <pre><code class="CSS">  <div class="section" id="SOURCE-DOC">
37  li {  <h3>Document Fragment</h3>
38    
39    <pre><code class="HTML">&lt;<code class="HTMLe">ul</code>&gt;
40      &lt;<code class="HTMLe">li</code>&gt;List item 1&lt;/<code class="HTMLe">li</code>&gt;
41      &lt;<code class="HTMLe">li</code>&gt;List item 2&lt;/<code class="HTMLe">li</code>&gt;
42      &lt;<code class="HTMLe">li</code>&gt;List item 3&lt;/<code class="HTMLe">li</code>&gt;
43      &lt;<code class="HTMLe">li</code>&gt;>List item 4&lt;/<code class="HTMLe">li</code>&gt;
44    &lt;/<code class="HTMLe">ul</code>&gt;</code></pre>
45    
46    <p class="note memo">Only!  No <code class="HTMLa">onmouseover</code>
47    is required in HTML documents!</p>
48    
49    </div>
50    
51    <div class="section" id="SOURCE-STYLE">
52    <h3>Style Sheet Fragment</h3>
53    
54    <pre><code class="CSS"><code class="HTMLe">li</code> {
55    behavior: expression(function (el) {    behavior: expression(function (el) {
56      el.onmouseover = function () { this.className += ' <em>HOVER</em>' };      el.onmouseover = function () { this.className += ' <em>HOVER</em>' };
57      el.onmouseout = function () { this.className = this.className.replace (/\\s*<em>HOVER</em>\\b/g, '') };      el.onmouseout = function () { this.className = this.className.replace (/\\s*<em>HOVER</em>\\b/g, '') };
58      runtimeStyle.bahavior = 'none';      runtimeStyle.bahavior = 'none';
59    } (this));    } (this));
60  }  }
61  li:hover <code class="comment">/* For CSS compliant user agents */</code>,  <code class="HTMLe">li</code>:hover <code class="comment">/* For CSS compliant user agents */</code>,
62  li.<em>HOVER</em> <code class="comment">/* For WinIE */</code> {  <code class="HTMLe">li</code>.<em>HOVER</em> <code class="comment">/* For WinIE */</code> {
63    color: red;    color: red;
64    background-color: white;    background-color: white;
65  }</code></pre>  }</code></pre>
66    
67  </div>  </div>
68    </div>
69    
70  </body>  </body>
71  </html>  </html>
Legend:
Removed from v.1.1  
changed lines
  Added in v.1.2
admin@suikawiki.org
 ViewVC Help
Powered by ViewVC 1.1.24