计算机科学论坛--显示贴子

以文本方式查看主题

-  计算机科学论坛  (http://bbs.xml.org.cn/index.asp)
--  『 SVG/GML/VRML/X3D/XAML 』  (http://bbs.xml.org.cn/list.asp?boardid=21)
----  svg 漂亮时钟  (http://bbs.xml.org.cn/dispbbs.asp?boardid=21&rootid=&id=9078)

--  作者：卷积内核
--  发布时间：8/2/2004 10:39:00 AM

--  svg 漂亮时钟
<?xml version="1.0"?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg onload="settime(evt)">
<defs>
<script language="Javascript">
<![CDATA[
function settime(evt)
{
var now=new Date();
var Seconds=now.getSeconds();
var Minutes=now.getMinutes()+Seconds/60;
var Hours=now.getHours()+Minutes/60;
var SVG_Document=evt.getTarget().getOwnerDocument();
SVG_Document.getElementById("seconds").setAttribute('transform','rotate('+(Seconds*6)+')');
SVG_Document.getElementById("minutes").setAttribute('transform','rotate('+(Minutes*6)+')');
SVG_Document.getElementById("hours").setAttribute('transform','rotate('+(Hours*30)+')');
refresh=true;
}
]]>
</script>
<filter id="metallic">
<feGaussianBlur result="blurredAlpha" in="SourceAlpha" stdDeviation="3"/>
<feOffset result="offsetBlurredAlpha" in="blurredAlpha" dx="2" dy="1"/>
<feDiffuseLighting result="bumpMapDiffuse" in="blurredAlpha" surfaceScale="5" diffuseConstant="0.5" style="lighting-color:rgb(255,255,255)">
<feDistantLight azimuth="135" elevation="60"/>
</feDiffuseLighting>
<feComposite result="litPaint" in="bumpMapDiffuse" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" in2="SourceGraphic"/>
<feSpecularLighting result="bumpMapSpecular" in="blurredAlpha" surfaceScale="5" specularConstant="0.5" specularExponent="10" style="lighting-color:rgb(255,255,255)">
<feDistantLight azimuth="135" elevation="60"/>
</feSpecularLighting>
<feComposite result="litPaint" in="litPaint" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" in2="bumpMapSpecular"/>
<feComposite result="litPaint" in="litPaint" operator="in" in2="SourceAlpha"/>
<feMerge>
<feMergeNode in="offsetBlurredAlpha"/>
<feMergeNode in="litPaint"/>
</feMerge>
</filter>
</defs>
<circle cx="100" cy="100" r="80" style="filter:url(#metallic);fill:white;stroke:rgb(11,11,13);stroke-width:4;"/>
<g style="font-family:Times;font-size:15">
<text x="130" y="46">I</text>
<text x="154" y="71">II</text>
<text x="165" y="106">III</text>
<text x="155" y="140">IV</text>
<text x="130" y="166">V</text>
<text x="96" y="175">VI</text>
<text x="62" y="166">VII</text>
<text x="37" y="140">IIX</text>
<text x="27" y="106">IX</text>
<text x="34" y="71">X</text>
<text x="58" y="46">XI</text>
<text x="92" y="37">XII</text>
</g>
<g transform="translate(100 100)">
<g id="hours">
<line x1="0" y1="0" x2="0" y2="-35" style="stroke-width:4;stroke:black">
<animateTransform attributeName="transform" type="rotate" dur="43200s" values="0;360" repeatCount="indefinite"/>
</line>
</g>
<g id="minutes">
<line x1="0" y1="0" x2="0" y2="-55" style="stroke-width:2;stroke:black">
<animateTransform attributeName="transform" type="rotate" dur="3600s" values="0;360" repeatCount="indefinite"/>
</line>
</g>
<g id="seconds">
<line x1="0" y1="0" x2="0" y2="-75" style="stroke-width:1;stroke:red">
<animateTransform attributeName="transform" type="rotate" dur="60s" values="0;360" repeatCount="indefinite"/>
</line>
</g>
</g>
<cirle cx="100" cy="100" r="3" style="fill:blue;stroke:black"/>
</svg>

--  作者：thomsonjin
--  发布时间：10/29/2004 11:42:00 AM

--
不错，顶！！！

--  作者：zhiyu-2000
--  发布时间：12/6/2004 10:13:00 AM

--
真的很好！
能不能把这个时钟变为文本格式的？就像电脑屏幕右下角的时间一样

--  作者：zhiyu-2000
--  发布时间：12/6/2004 3:33:00 PM

--
卷积内核：我已经在以前的帖子上看到文本时钟了，也是你发的

--  作者：bgming
--  发布时间：12/15/2004 3:25:00 PM

--
真好

--  作者：SCYANGYU
--  发布时间：2/18/2005 10:07:00 AM

--
真不错！

谢谢分享！

W 3 C h i n a ( since 2003 ) 旗下站点
苏ICP备05006046号《全国人大常委会关于维护互联网安全的决定》《计算机信息网络国际联网安全保护管理办法》

11,457.030ms