fabric.js/test/W3C_SVG_12_TinyTestSuite_beta/htmlObjectHarness/animate-elem-85-t.html

86 lines
3.3 KiB
HTML
Raw Normal View History

2010-06-10 15:14:53 +00:00
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="keywords" content="W3C SVG 1.1 Test Suite testsuite mobile"/>
<meta name="description" content="W3C SVG 1.2 Tiny Test Suite"/>
<title>
SVG 1.2 Tiny test:animate-elem-85-t </title>
<style type="text/css">
<!--
.bodytext { font-family:verdana, helvetica, sans-serif; font-size: 12pt; line-height: 125%; text-align: Left; margin-top: 0; margin-bottom: 0 }
.pageTitle { line-height: 150%; font-size: 20pt; font-weight : 900; margin-bottom: 20pt }
.pageSubTitle { color : blue; line-height: 100%; font-size: 24pt; font-weight : 900 }
.openChapter { color : blue; line-height: 125%; font-weight : 900 }
.openSection { color : blue; line-height: 125%; font-weight : 900 }
.info { color : black; line-height: 110%; font-size: 10pt; font-weight : 100 }
p { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
blockquote { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
.opscript {margin-left: 3%; margin-right: 3%; }
.opscript p { margin-top: 0.7em}
.navbar {background: black; color: white; font-weight: bold}
-->
</style>
</head>
<body class="bodytext">
<div class="linkbar">
<p>
<a href="animate-elem-85-t.html">Tiny version</a></p>
<p>Specification link: <a target="spec" href="http://www.w3.org/TR/SVGMobile12/animate.html">16.2 Animation elements</a></p>
<p>
<a href="animate-elem-84-t.html">animate-elem-84-t ←</a>
<a href="index.html">index</a>
<a href="animate-elem-86-t.html">→ animate-elem-86-t</a>
</p></div>
<table align="center" border="0" cellspacing="0" cellpadding="10">
<tr>
<td align="center" colspan="3">
<table border="0" cellpadding="8">
<tr>
<td align="center" colspan="2" class="pageTitle">
<h1>animate-elem-85-t</h1>
</td>
</tr>
<tr class="navbar">
<td align="center">
SVG Image
</td>
<td align="center">
PNG Image
</td>
</tr>
<tr>
<td align="right">
<object data="../svggen/animate-elem-85-t.svg" width="480" height="360" type="image/svg+xml"><p style="font-size:300%;color:red">FAIL</p></object>
</td>
<td align="left">
<img alt="raster image of animate-elem-85-t" src="../png/animate-elem-85-t.png" width="480" height="360"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
<div class="opscript">
<p>All four rectangles at the top must smoothly animate from black to green over 5 seconds.</p>
<p>
During this time the bottom two rectangles must be red. Then, the bottom two rectangles must smoothly animate
from green( at five seconds), through khaki (at 7.5 seconds), to yellow (at 10 seconds and above). Colored
circles indicate the appropriate colors at these times.
</p>
</div>
<div class="linkbar"> <p>
<a href="animate-elem-84-t.html">animate-elem-84-t ←</a>
<a href="index.html">index</a>
<a href="animate-elem-86-t.html">→ animate-elem-86-t</a>
</p></div>
</body>
</html>