You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
41 lines
1.5 KiB
41 lines
1.5 KiB
<?xml version="1.0" standalone="no"?>
|
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
|
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
|
<svg width="4cm" height="2cm" viewBox="0 0 400 200"
|
|
onload="StartAnimation(evt)"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
|
|
<script type="text/ecmascript"><![CDATA[
|
|
var timevalue = 0;
|
|
var timer_increment = 50;
|
|
var max_time = 5000;
|
|
var text_element;
|
|
function StartAnimation(evt) {
|
|
text_element = evt.target.ownerDocument.getElementById("TextElement");
|
|
ShowAndGrowElement();
|
|
}
|
|
function ShowAndGrowElement() {
|
|
timevalue = timevalue + timer_increment;
|
|
if (timevalue > max_time)
|
|
return;
|
|
|
|
// Scale the text string gradually until it is 20 times larger
|
|
scalefactor = (timevalue * 20.) / max_time * 40;
|
|
text_element.setAttribute("transform", "scale(" + scalefactor + ")");
|
|
// Make the string more opaque
|
|
opacityfactor = timevalue / max_time;
|
|
// text_element.setAttribute("opacity", opacityfactor);
|
|
|
|
// Call ShowAndGrowElement again <timer_increment> milliseconds later.
|
|
// setTimeout("ShowAndGrowElement()", timer_increment)
|
|
}
|
|
window.ShowAndGrowElement = ShowAndGrowElement
|
|
]]></script>
|
|
<rect x="1" y="1" width="398" height="198"
|
|
fill="none" stroke="blue" stroke-width="2"/>
|
|
|
|
<g transform="translate(50,150)" fill="red" font-size="7">
|
|
<text id="TextElement">SVG</text>
|
|
</g>
|
|
</svg>
|
