third_party/WebKit/LayoutTests/svg/as-background-image/resources/eyes.svg

   1
   2 <svg width="100%" height="100%"
   3         xmlns="http://www.w3.org/2000/svg"
   4      xmlns:xlink="http://www.w3.org/1999/xlink"
   5          onload="startup(evt)">
   6 >
   7 <script>
   8 <![CDATA[
   9 var svgDocument;
  10 var svgDocument;
  11 var xmlns="http://www.w3.org/2000/svg"
  12 function startup(evt) {
  13         O=evt.target
  14         svgDocument=O.ownerDocument
  15         O.setAttribute("onmousedown","running=!running;repoint()")
  16         RG=svgDocument.getElementById("gradient1");
  17         repoint()
  18 }
  19 running=true
  20 x=65
  21 xincr=.15
  22 function repoint(){
  23         if (!running) return
  24         RG.setAttributeNS(null, 'cx', 100-x)
  25         RG.setAttributeNS(null, 'fx', 60*Math.cos(x))
  26         RG.setAttributeNS(null, 'fy', 30*Math.sin(x))
  27         x=x+xincr
  28         if ((x<0)||(x>300))xincr=-xincr
  29         window.setTimeout("repoint()", 10)
  30 }
  31 //]]>
  32 </script>
  33 <radialGradient id="gradient1" cx="0" cy="80" r="280" fx="150" fy="80" gradientUnits="userSpaceOnUse">
  34         <stop  offset=".00" style="stop-color:#441155"/>
  35         <stop  offset=".13" style="stop-color:#442266"/>
  36         <stop  offset=".15" style="stop-color:#5599bb"/>
  37         <stop  offset="0.25" style="stop-color:#ffffff"/>
  38         <stop  offset="0.7" style="stop-color:#ffddcc"/>
  39         <stop  offset="1" style="stop-color:#ffaaaa"/>
  40 </radialGradient>
  41
  42 <g style="fill:url(#gradient1)" stroke-width="2" stroke="salmon"  transform="translate(100,20) scale(0.4)">
  43 <ellipse transform="translate(100 200) rotate(20)" rx="250" ry="150"/>
  44 <ellipse transform="translate(600 200) rotate(-30)" rx="250" ry="150"/>
  45 <ellipse transform="translate(100 500) rotate(-30)" rx="250" ry="150"/>
  46 <ellipse transform="translate(600 500) rotate(10)" rx="250" ry="150"/>
  47 </g><text x="140" y="35" font-size="24">Click to start/stop</text>
  48 </svg>