48 lines
2.5 KiB
HTML
48 lines
2.5 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
|
|
<html><head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
<title>CSS Test: dynamic changes to 'counter-increment'</title>
|
|
<link rel="author" href="http://dbaron.org/" title="L. David Baron">
|
|
<link rel="help" href="http://www.w3.org/TR/CSS21/generate.html#counters">
|
|
<link rel="help" href="http://www.w3.org/TR/CSS21/generate.html#propdef-content">
|
|
<link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#counter">
|
|
<meta content="dom" name="flags">
|
|
<meta http-equiv="Content-Script-Type" content="text/javascript">
|
|
<style type="text/css">
|
|
body { white-space: nowrap; }
|
|
#test, .reset { counter-reset: c; }
|
|
.increment:before { content: counters(c, ".") "-"; }
|
|
.increment { counter-increment: c; }
|
|
</style>
|
|
<script type="text/javascript">
|
|
if (window.testRunner) {
|
|
testRunner.dumpAsText();
|
|
testRunner.waitUntilDone();
|
|
}
|
|
|
|
function run() {
|
|
document.getElementById("one").setAttribute("class", "reset");
|
|
document.getElementById("two").removeAttribute("class");
|
|
if (window.testRunner) {
|
|
testElement = document.getElementById("test");
|
|
console = document.getElementById("console");
|
|
spanList = testElement.getElementsByTagName("span")
|
|
for (i = 0; i < spanList.length; ++i ) {
|
|
newSpanElement = document.createElement("span");
|
|
newSpanElement.innerText =
|
|
window.internals.counterValue(document.getElementById(spanList.item(i).getAttribute("id")));
|
|
if (newSpanElement.innerText.length)
|
|
newSpanElement.innerText = newSpanElement.innerText + "-";
|
|
console.appendChild(newSpanElement);
|
|
}
|
|
testRunner.notifyDone();
|
|
}
|
|
}
|
|
</script>
|
|
</head><body onload="setTimeout('run()', 0)">
|
|
<p>The following two lines should be the same:</p>
|
|
<div id="test"><span id="span1" class="increment"></span><span id="span2"><span class="reset" id="one"><span id="span4" class="increment"></span></span></span><span id="span5" class="increment"></span><span id="span6"><span id="two"><span id="span7" class="increment"></span></span></span><span id="span8" class="increment"></span></div>
|
|
<div id="reference">1-1.1-2-3-4-</div>
|
|
<div id="console" />
|
|
</body></html>
|