<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" language="Javascript">
<![CDATA[
function runText()
{
for(var y=0; y<=1000; y+=100)
{
for(var x=0; x<=500; x+=100)
{
var svgArea = document.getElementById("svgArea");
var text = document.createElementNS("http://www.w3.org/2000/svg", "text");
text.setAttributeNS(null, "x", x);
text.setAttributeNS(null, "y", y+20);
text.setAttributeNS(null, "fill", "black");
text.setAttributeNS(null, "font-size", 20);
text.setAttributeNS(null, "text-anchor", "start");
text.appendChild(document.createTextNode("just a text"));
svgArea.appendChild(text);
}
}
var scrolldiv = document.getElementById("scrolldiv");
scrolldiv.scrollTop = 550;
}
]]>
</script>
<title>BUG 12163: SVG text disappears in scrolling div</title>
</head>
<body onload="runText();">
<p>In the div below the text is distributed over the whole SVG area. But when you scroll around the invisible text does not appear (Bug 12163).</p>
<div style="overflow:auto; position:absolute; left:10px; width:500px; height:500px; border:1px solid #aaaaaa;" id="scrolldiv">
<svg id="svgArea" width = "5000" height = "5000" xmlns = "http://www.w3.org/2000/svg"></svg>
</div>
</body>
</html>