87,920
社区成员
发帖
与我相关
我的任务
分享vml精品收集，以祝emu生日快乐
要求用纯vml写，用js定位的就不用贴了
举个例子，如Msdn的飞船
http://msdn.microsoft.com/workshop/author/vml/shape/shaptype/t_group.asp
简单的也行，但必须实用，如曲线图，饼图，圆角文本框
举个例子，如Msdn的飞船
http://msdn.microsoft.com/workshop/author/vml/shape/shaptype/t_group.asp
简单的也行，但必须实用，如曲线图，饼图，圆角文本框
...全文
请发表友善的回复…
发表回复
linday 2003-01-11
- 打赏
- 举报
HAPPY!
江南昆虫 2003-01-11
- 打赏
- 举报
呵呵～～生日快乐啊！
我也来一个对话式文本框：）
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv=Content-Type content="text/html; charset=GB2312">
<style>
v\:* {behavior:url(#default#VML);}
</style>
</head>
<body>
<v:shapetype id="jnkcVML" coordsize="21600,21600" o:spt="63" adj="1350,25920" path="wr0,,21600,21600@15@16@17@18l@21@22xe">
</v:shapetype>
<v:shape type="#jnkcVML" style='position:absolute;left:100;top:100;width:140;height:40' adj="1590,34671" fillcolor="#0cf" strokecolor="#f90" strokeweight="3">
<v:textbox>
<INPUT id="jnkcInput" style="width:100%;height:100%;background-color:#0cf;border:0" />
</v:textbox>
</v:shape>
</body>
</html>
我也来一个对话式文本框：）
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv=Content-Type content="text/html; charset=GB2312">
<style>
v\:* {behavior:url(#default#VML);}
</style>
</head>
<body>
<v:shapetype id="jnkcVML" coordsize="21600,21600" o:spt="63" adj="1350,25920" path="wr0,,21600,21600@15@16@17@18l@21@22xe">
</v:shapetype>
<v:shape type="#jnkcVML" style='position:absolute;left:100;top:100;width:140;height:40' adj="1590,34671" fillcolor="#0cf" strokecolor="#f90" strokeweight="3">
<v:textbox>
<INPUT id="jnkcInput" style="width:100%;height:100%;background-color:#0cf;border:0" />
</v:textbox>
</v:shape>
</body>
</html>
leaxin 2003-01-11
- 打赏
- 举报
祝 emu生日快乐
祝大家也快乐
祝大家也快乐
kokothx 2003-01-11
- 打赏
- 举报
你好，也许我对这些都不是很了解的，希望你们多多指教。祝你新年快乐，永远开心。
walkingpoison 2003-01-11
- 打赏
- 举报
再次住emu生日快乐！
顺便收藏，嘿嘿
顺便收藏，嘿嘿
emu 2003-01-11
- 打赏
- 举报
呵呵，原来蛋糕上有签名的，秋水就是细心。
以前就看到秋水画的曲线图，没有更新的vml作品吗？
以前就看到秋水画的曲线图，没有更新的vml作品吗？
qiushuiwuhen 2003-01-11
- 打赏
- 举报
精品这么少？其实WebFx的Clock也不错呀，今晚上揭贴。
<!-- VML include -->
<xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/>
<object id="VMLRender" codebase="vgx.dll" classid="CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E"></object>
<style>
<!--
v\:* { behavior: url(#VMLRender); }
-->
</style>
<!-- end VML include -->
<script>
function updatePointers() {
var now = new Date();
secondsPointer.style.rotation = now.getSeconds() * 6;
minutesPointer.style.rotation = now.getMinutes() * 6 + now.getSeconds() / 10;
hoursPointer.style.rotation = now.getHours() * 30 + now.getMinutes() / 2;
}
window.attachEvent("onload", initVMLClock);
function initVMLClock() {
updatePointers();
window.setInterval("updatePointers()", 1000);
}
</script>
<v:group id="clock" coordsize="100 100" style="width: 200px; height: 200px; position: relative; filter: alpha(opacity=90);">
<v:oval style="width: 100%; height: 100%">
<v:stroke weight="10px" color="#eeeeee"/>
<!-- I removed this gradient fill to match the WebFX color theme
<v:fill type="gradient" color="white" color2="#eeeeff" angle="225deg"/>
-->
</v:oval>
<v:group id="secondsPointer" style="width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;">
<v:line from="50,50" to="50,5">
<v:stroke weight="2px" endcap="round" color="navy"/>
</v:line>
</v:group>
<v:group id="minutesPointer" style="width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;">
<v:line from="50,50" to="50,8">
<v:stroke weight="4px" endcap="round" color="navy"/>
</v:line>
</v:group>
<v:group id="hoursPointer" style="width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;">
<v:line from="50,50" to="50,18">
<v:stroke weight="7px" endcap="round" color="navy"/>
</v:line>
</v:group>
</v:group>
to xizi2002,你的蛋糕底下还有meizz的名字呢，呵呵
<!-- VML include -->
<xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/>
<object id="VMLRender" codebase="vgx.dll" classid="CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E"></object>
<style>
<!--
v\:* { behavior: url(#VMLRender); }
-->
</style>
<!-- end VML include -->
<script>
function updatePointers() {
var now = new Date();
secondsPointer.style.rotation = now.getSeconds() * 6;
minutesPointer.style.rotation = now.getMinutes() * 6 + now.getSeconds() / 10;
hoursPointer.style.rotation = now.getHours() * 30 + now.getMinutes() / 2;
}
window.attachEvent("onload", initVMLClock);
function initVMLClock() {
updatePointers();
window.setInterval("updatePointers()", 1000);
}
</script>
<v:group id="clock" coordsize="100 100" style="width: 200px; height: 200px; position: relative; filter: alpha(opacity=90);">
<v:oval style="width: 100%; height: 100%">
<v:stroke weight="10px" color="#eeeeee"/>
<!-- I removed this gradient fill to match the WebFX color theme
<v:fill type="gradient" color="white" color2="#eeeeff" angle="225deg"/>
-->
</v:oval>
<v:group id="secondsPointer" style="width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;">
<v:line from="50,50" to="50,5">
<v:stroke weight="2px" endcap="round" color="navy"/>
</v:line>
</v:group>
<v:group id="minutesPointer" style="width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;">
<v:line from="50,50" to="50,8">
<v:stroke weight="4px" endcap="round" color="navy"/>
</v:line>
</v:group>
<v:group id="hoursPointer" style="width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;">
<v:line from="50,50" to="50,18">
<v:stroke weight="7px" endcap="round" color="navy"/>
</v:line>
</v:group>
</v:group>
to xizi2002,你的蛋糕底下还有meizz的名字呢，呵呵
xizi2002 2003-01-11
- 打赏
- 举报
emu 兄，祝你生日快乐！！这么多人为你边生日，感觉羡慕。
iiiiiiiiiiiiiiiiiiiii
|||||||H|A|P|P|Y|||||||
__|_____________________|__
|\/\/\/\/\/\/\/\/\\/\/\/\/\/|
|||||||B|I|R|T|H|D|A|Y||||||| 生日快乐
|,,,,,,,,,,,,,,,,,,,,,,,,,,,|
@@@@@@@@@@M@E@I@Z@Z@@@@@@@@@@
iiiiiiiiiiiiiiiiiiiii
|||||||H|A|P|P|Y|||||||
__|_____________________|__
|\/\/\/\/\/\/\/\/\\/\/\/\/\/|
|||||||B|I|R|T|H|D|A|Y||||||| 生日快乐
|,,,,,,,,,,,,,,,,,,,,,,,,,,,|
@@@@@@@@@@M@E@I@Z@Z@@@@@@@@@@
wealth 2003-01-11
- 打赏
- 举报
up
flyycyu 2003-01-10
- 打赏
- 举报
up
llrock 2003-01-10
- 打赏
- 举报
嘿嘿，emu生日快乐！
大家话的可真漂亮呀。
不过VML还是没有提供GDI接口，要是提供了，就可以更精彩了。
大家话的可真漂亮呀。
不过VML还是没有提供GDI接口，要是提供了，就可以更精彩了。
emu 2003-01-10
- 打赏
- 举报
大家可曾发现现在市面上的出版物有没有vml的教程的？
我曾留意过一断时间，只发现在《xml应用大全》里面发现了一章，写的还挺详细。不知有没有更好更详尽的教程？
我曾留意过一断时间，只发现在《xml应用大全》里面发现了一章，写的还挺详细。不知有没有更好更详尽的教程？
emu 2003-01-10
- 打赏
- 举报
原来美洲豹的教程还有这个地址可以看的啊。
重提一下http://www.su27.net/vml/step313.html中提到的一个问题：
--------------------------------------------------------------------
我先研究 http://www.w3.org/TR/NOTE-VML 里面有写关于 path 里面的 ae (AngleEllipseTo) 命令。那个命令确实可以很简单的完成，但它有 6 个参数，最后两个参赛很难理解。因为在一些例子中，这两个数非常大，五六位之多。不得其解
--------------------------------------------------------------------
我后来写的drawpie函数中用的就是ae命令，仔细看过的网友可能会觉得
var maxScale = 360<<16
这行很费解。
其实ae后面那两个参数一个是开始的角度，一个是跨越的角度，这两个角度的单位有点奇怪，是将度数左移16位（或者乘以65536），所以会非常大。
这个比例我是试验出来的，没有参考过相关文档，也不知为什么会这么规定。
重提一下http://www.su27.net/vml/step313.html中提到的一个问题：
--------------------------------------------------------------------
我先研究 http://www.w3.org/TR/NOTE-VML 里面有写关于 path 里面的 ae (AngleEllipseTo) 命令。那个命令确实可以很简单的完成，但它有 6 个参数，最后两个参赛很难理解。因为在一些例子中，这两个数非常大，五六位之多。不得其解
--------------------------------------------------------------------
我后来写的drawpie函数中用的就是ae命令，仔细看过的网友可能会觉得
var maxScale = 360<<16
这行很费解。
其实ae后面那两个参数一个是开始的角度，一个是跨越的角度，这两个角度的单位有点奇怪，是将度数左移16位（或者乘以65536），所以会非常大。
这个比例我是试验出来的，没有参考过相关文档，也不知为什么会这么规定。
genuis 2003-01-10
- 打赏
- 举报
支持！！！！
<html>
<head>
<meta content="text/html; charset=gb2312" http-equiv="Content-Type">
<meta content="Microsoft FrontPage 4.0" name="GENERATOR">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>随便画，看看效果</title>
</head>
<body>
<object classid="CLSID:0002E500-0000-0000-C000-000000000046" height="100%"
id="ChartSpace1" width="100%">
</object>
<script language=VBScript>
dim ser
dim xpt()
dim ypt()
dim curpt
dim max
dim width, height
Sub Window_OnLoad()
window.status = "Click to set a point; double-click to end the shape."
width = chartspace1.offsetwidth
height = chartspace1.offsetheight
curpt = 0
max = 50
redim xpt(max)
redim ypt(max)
set ch = chartspace1.charts.add
ch.type = chartspace1.constants.chChartTypeScatterLineFilled
ch.axes(0).scaling.hasautomaximum = false
ch.axes(0).scaling.hasautominimum = false
ch.axes(1).scaling.hasautomaximum = false
ch.axes(1).scaling.hasautominimum = false
ch.axes(0).scaling.minimum = 0
ch.axes(1).scaling.minimum = 0
ch.axes(0).scaling.maximum = 10000
ch.axes(1).scaling.maximum = 10000
ch.axes(0).scaling.orientation = 1
ch.axes.delete(0)
ch.axes.delete(0)
set ser = ch.seriescollection.add
ser.datalabelscollection.add
End Sub
Sub Window_onResize()
width = chartspace1.offsetwidth
height = chartspace1.offsetheight
End Sub
Sub ChartSpace1_MouseMove(e)
xpt(curpt) = CInt(e.X*10000/width)
ypt(curpt) = CInt(e.Y*10000/height)
ser.setdata 4, -1, xpt
ser.setdata 3, -1, ypt
chartspace1.refresh
End Sub
Sub chartspace1_click(e)
xpt(curpt) = CInt(e.X*10000/width)
ypt(curpt) = CInt(e.Y*10000/height)
ser.setdata 4, -1, xpt
ser.setdata 3, -1, ypt
curpt = curpt+1
if curpt > max then
call newseries
end if
End Sub
Sub chartspace1_dblclick(e)
xpt(curpt) = null
ypt(curpt) = null
ser.setdata 4, -1, xpt
ser.setdata 3, -1, ypt
call newseries
End Sub
Sub newseries
ser.datalabelscollection.delete(0)
set ser = ser.parent.seriescollection.add
ser.datalabelscollection.add
for i = 0 to max
xpt(i) = null
ypt(i) = null
next
curpt = 0
End Sub
</script>
</body>
</html>
<html>
<head>
<meta content="text/html; charset=gb2312" http-equiv="Content-Type">
<meta content="Microsoft FrontPage 4.0" name="GENERATOR">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>随便画，看看效果</title>
</head>
<body>
<object classid="CLSID:0002E500-0000-0000-C000-000000000046" height="100%"
id="ChartSpace1" width="100%">
</object>
<script language=VBScript>
dim ser
dim xpt()
dim ypt()
dim curpt
dim max
dim width, height
Sub Window_OnLoad()
window.status = "Click to set a point; double-click to end the shape."
width = chartspace1.offsetwidth
height = chartspace1.offsetheight
curpt = 0
max = 50
redim xpt(max)
redim ypt(max)
set ch = chartspace1.charts.add
ch.type = chartspace1.constants.chChartTypeScatterLineFilled
ch.axes(0).scaling.hasautomaximum = false
ch.axes(0).scaling.hasautominimum = false
ch.axes(1).scaling.hasautomaximum = false
ch.axes(1).scaling.hasautominimum = false
ch.axes(0).scaling.minimum = 0
ch.axes(1).scaling.minimum = 0
ch.axes(0).scaling.maximum = 10000
ch.axes(1).scaling.maximum = 10000
ch.axes(0).scaling.orientation = 1
ch.axes.delete(0)
ch.axes.delete(0)
set ser = ch.seriescollection.add
ser.datalabelscollection.add
End Sub
Sub Window_onResize()
width = chartspace1.offsetwidth
height = chartspace1.offsetheight
End Sub
Sub ChartSpace1_MouseMove(e)
xpt(curpt) = CInt(e.X*10000/width)
ypt(curpt) = CInt(e.Y*10000/height)
ser.setdata 4, -1, xpt
ser.setdata 3, -1, ypt
chartspace1.refresh
End Sub
Sub chartspace1_click(e)
xpt(curpt) = CInt(e.X*10000/width)
ypt(curpt) = CInt(e.Y*10000/height)
ser.setdata 4, -1, xpt
ser.setdata 3, -1, ypt
curpt = curpt+1
if curpt > max then
call newseries
end if
End Sub
Sub chartspace1_dblclick(e)
xpt(curpt) = null
ypt(curpt) = null
ser.setdata 4, -1, xpt
ser.setdata 3, -1, ypt
call newseries
End Sub
Sub newseries
ser.datalabelscollection.delete(0)
set ser = ser.parent.seriescollection.add
ser.datalabelscollection.add
for i = 0 to max
xpt(i) = null
ypt(i) = null
next
curpt = 0
End Sub
</script>
</body>
</html>
chjpeng 2003-01-10
- 打赏
- 举报
我看到 美洲豹 的教程了,
http://www.su27.net/vml/index.html
下面摘一點點: (借花獻佛^_^)
VML的基本概念
VML相当于IE里面的画笔，能实现你所想要的图形，而且结合脚本，可以让图形产生动态的效果。VML是微软1999年9月附带IE5.0发布的。VML其实是Word和HTML结合的产物。可以将Word文档另存为HTML，其中的文本和图片可以很容易的转换，但如果是手绘制的图形在以往的IE里面就无法解释了，如果都转换成图形文件又不太现实。于是微软把Word里面的图形控件结合到IE里面，使IE也具备了绘图功能。
VML的全称是Vector Markup Language(矢量可标记语言)，矢量的图形，意味着图形可以任意放大缩小而不损失图形的质量，这在制作地图上有很大用途。
***動態生成vml
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>动态创建VML</title>
</head>
<STYLE>
v\:* { BEHAVIOR: url(#default#VML) }
</STYLE>
<script language="JavaScript">
function createPoint(x,y,v)
{
var strElement="<v:rect title='"+v+"' style='top:"+x+";left:"+y+"width:100;height:100'></v:rect>";
var newPoint = document.createElement(strElemnt);
group1.insertBefore(newPoint);
}
</script>
<body>
<v:group ID="group1" style="WIDTH:200px;HEIGHT:200px;" coordsize = "200,200">
</v:group>
<iframe src="readData.asp" name="data" style="display:none"></iframe>
</body>
</html>
相应的在 readData.asp 里面:
<script>
<%
'数据库连接部分
'读数据部分
Do Until rs.EOF
%>
parent.createPoint(<%=x%>,<%=y%>,<%=value%>);
<%
Loop
'数据库关闭部分
%>
</script>
http://www.su27.net/vml/index.html
下面摘一點點: (借花獻佛^_^)
VML的基本概念
VML相当于IE里面的画笔，能实现你所想要的图形，而且结合脚本，可以让图形产生动态的效果。VML是微软1999年9月附带IE5.0发布的。VML其实是Word和HTML结合的产物。可以将Word文档另存为HTML，其中的文本和图片可以很容易的转换，但如果是手绘制的图形在以往的IE里面就无法解释了，如果都转换成图形文件又不太现实。于是微软把Word里面的图形控件结合到IE里面，使IE也具备了绘图功能。
VML的全称是Vector Markup Language(矢量可标记语言)，矢量的图形，意味着图形可以任意放大缩小而不损失图形的质量，这在制作地图上有很大用途。
***動態生成vml
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>动态创建VML</title>
</head>
<STYLE>
v\:* { BEHAVIOR: url(#default#VML) }
</STYLE>
<script language="JavaScript">
function createPoint(x,y,v)
{
var strElement="<v:rect title='"+v+"' style='top:"+x+";left:"+y+"width:100;height:100'></v:rect>";
var newPoint = document.createElement(strElemnt);
group1.insertBefore(newPoint);
}
</script>
<body>
<v:group ID="group1" style="WIDTH:200px;HEIGHT:200px;" coordsize = "200,200">
</v:group>
<iframe src="readData.asp" name="data" style="display:none"></iframe>
</body>
</html>
相应的在 readData.asp 里面:
<script>
<%
'数据库连接部分
'读数据部分
Do Until rs.EOF
%>
parent.createPoint(<%=x%>,<%=y%>,<%=value%>);
<%
Loop
'数据库关闭部分
%>
</script>
方工 2003-01-10
- 打赏
- 举报
Another - 星光闪耀
<HTML xmlns:v = "urn:schemas-microsoft-com:vml"><HEAD>
<TITLE>VML Animation - Stars</TITLE>
<OBJECT classid=CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E
id=VMLRender></OBJECT>
<STYLE>v\:* {
BEHAVIOR: url(#VMLRender)
}
</STYLE>
</HEAD>
<BODY bgColor=#ffffff onresize=resize() scroll=no>
<v:rect id=bg
style="HEIGHT:400pt;LEFT:0pt;POSITION:absolute;TOP:0pt;WIDTH:880pt;Z-INDEX:-1"
coordsize = "21600,21600"
fillcolor = "#a8f4f7"
strokecolor="#000000">
<v:fill type = "gradient"
color2 = "#003159"
angle = "45"
focus = "100%"
focusposition = ".5,.5"
focussize = "0,0"
method = "linear sigma">
</v:fill>
</v:rect>
<script>
//globals for HSV to RGB conversion
irpnt=new Array(2,1,0,0,3,2);
igpnt=new Array(3,2,2,1,0,0);
ibpnt=new Array(0,0,3,2,2,1);
//
w=0;
h=0;
resize();
scol=new colour(57,.61,.89);
ss=new Array(50,90,75,50,60);
vs="";
for(j=0;j<ss.length;j++){
np=3+rnd(6);
sp=makestarpath(np,1000,900);
hue=rnd(360);
dhue=1+rnd(10);
theta=0;
dtheta=0.1+0.2*Math.random();
dr=rnd(14)-6;if(dr==0)dr=-7;
vx=rnd(10)-4;if(vx==0)vx=-5;
vy=rnd(10)-4;if(vy==0)vy=-5;
vs+="<v:shape id='V"+j+"' np="+np+" hue="+hue+" dhue="+dhue+" dr="+dr+" theta="+theta+" dtheta="+dtheta+" vx="+vx+" vy="+vy+" style='position:absolute;left:"+(6+rnd(w-ss[j]-12))+"px;top:"+(6+rnd(h-ss[j]-12))+"px;height:"+ss[j]+";width:"+ss[j]+";rotation:0;' fill='true' stroke='false' coordsize='2000,2000' coordorigin '0,0' fillcolor='#fdf9ae' strokeweight='2emu' path='"+sp+"'><v:fill type='gradientRadial' color2='#6f6022' angle='45' focus='100%' focusposition='.5,.5' focussize='2,2' method='linear sigma'></v:fill></v:shape>"
}
document.write(vs);
window.setInterval("frame();",20);
function frame(){
for(j=0;j<ss.length;j++){
S=document.all["V"+j];
//animate colour
hue=parseInt(S.hue);
dhue=parseInt(S.dhue);
hue+=dhue;
if(hue>=360)hue-=360;
S.hue=hue;
scol.h=hue;
scol.hsv2rgb();
S.fillcolor=scol.rgb;
//animate rotation
r=parseInt(S.style.rotation);
dr=parseInt(S.dr);
r+=dr;if(r>=360)r-=360;if(r<0)r+=360;
S.style.rotation=r;
//animate geometry
np=parseInt(S.np);
theta=parseFloat(S.theta);
dtheta=parseFloat(S.dtheta);
theta+=dtheta;if(theta>Math.PI)theta-=2*Math.PI;
sp=makestarpath(np,1000,200+1000*Math.sin(theta));
S.path=sp;
S.theta=theta;
//move & bounce stars
x=S.style.pixelLeft;
y=S.style.pixelTop;
vx=parseInt(S.vx);
vy=parseInt(S.vy);
x+=vx;
y+=vy;
if(x<0){vx=-vx;x+=vx;}
if(x>w-ss[j]){vx=-vx;x=2*(w-ss[j])-x;}
if(x>w-ss[j])x=0;
if(x<0)x=0;
if(y<0){vy=-vy;y+=vy;}
if(y>h-ss[j]){vy=-vy;y=2*(h-ss[j])-y;}
if(y>h-ss[j])y=0;
if(y<0)y=0;
S.style.pixelLeft=x;
S.style.pixelTop=y;
S.vx=vx;
S.vy=vy;
}
}
//n=number of points
//r1=outer diameter
//r2=inner diameter
//assumes coordsize='2000,2000' coordorigin '0,0'
function makestarpath(n,r1,r2){
s="";
pa=2*Math.PI/n;
ss1=Math.PI/2;
ss2=ss1-pa/2;
x1=Math.floor(r1*Math.cos(ss1));
y1=Math.floor(-r1*Math.sin(ss1));
x2=Math.floor(r2*Math.cos(ss2));
y2=Math.floor(-r2*Math.sin(ss2));
s="m "+(x2+1000)+","+(y2+1000)+" l ";
for (i=1;i<=n;i++){
if(i>1)s+=","
s+=(x1+1000)+","+(y1+1000)+",";
s1=ss1+i*pa;
s2=ss2+i*pa;
x1=Math.floor(r1*Math.cos(s1));
y1=Math.floor(-r1*Math.sin(s1));
x2=Math.floor(r2*Math.cos(s2));
y2=Math.floor(-r2*Math.sin(s2));
s+=(x2+1000)+","+(y2+1000);
}
s+=" e"
return(s);
}
function rnd(n){
return(Math.floor((n+1)*Math.random()));
}
function resize(){
w=document.body.clientWidth;
h=document.body.clientHeight;
bg.style.width=w;
bg.style.height=h;
}
//utility object for HSV to RGB conversion
function hsv2rgb(){
pqvt=new Array(4);
with(this){
if(s==0){
r=Math.floor(255*v);
g=r;
b=r;
return;
}
if(h>=360)h=0;
nh=h/60;
i=Math.floor(nh);
f=nh-i;
pqvt[2]=255*v;
pqvt[0]=pqvt[2]*(1-s)
pqvt[1]=pqvt[2]*(1-s*f)
pqvt[3]=pqvt[2]*(1-s*(1-f))
r=Math.floor(pqvt[irpnt[i]]);
g=Math.floor(pqvt[igpnt[i]]);
b=Math.floor(pqvt[ibpnt[i]]);
rgb="#"+(65536*r+256*g+b).toString(16);
}
}
function colour(h,s,v){
this.h=h; //0-359
this.s=s; //0-1
this.v=v; //0-1
this.r=0; //0-255
this.g=0; //0-255
this.b=0; //0-255
this.rgb="";
this.hsv2rgb=hsv2rgb;
//convert on construction
this.hsv2rgb();
}
</script>
</BODY></HTML>
<HTML xmlns:v = "urn:schemas-microsoft-com:vml"><HEAD>
<TITLE>VML Animation - Stars</TITLE>
<OBJECT classid=CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E
id=VMLRender></OBJECT>
<STYLE>v\:* {
BEHAVIOR: url(#VMLRender)
}
</STYLE>
</HEAD>
<BODY bgColor=#ffffff onresize=resize() scroll=no>
<v:rect id=bg
style="HEIGHT:400pt;LEFT:0pt;POSITION:absolute;TOP:0pt;WIDTH:880pt;Z-INDEX:-1"
coordsize = "21600,21600"
fillcolor = "#a8f4f7"
strokecolor="#000000">
<v:fill type = "gradient"
color2 = "#003159"
angle = "45"
focus = "100%"
focusposition = ".5,.5"
focussize = "0,0"
method = "linear sigma">
</v:fill>
</v:rect>
<script>
//globals for HSV to RGB conversion
irpnt=new Array(2,1,0,0,3,2);
igpnt=new Array(3,2,2,1,0,0);
ibpnt=new Array(0,0,3,2,2,1);
//
w=0;
h=0;
resize();
scol=new colour(57,.61,.89);
ss=new Array(50,90,75,50,60);
vs="";
for(j=0;j<ss.length;j++){
np=3+rnd(6);
sp=makestarpath(np,1000,900);
hue=rnd(360);
dhue=1+rnd(10);
theta=0;
dtheta=0.1+0.2*Math.random();
dr=rnd(14)-6;if(dr==0)dr=-7;
vx=rnd(10)-4;if(vx==0)vx=-5;
vy=rnd(10)-4;if(vy==0)vy=-5;
vs+="<v:shape id='V"+j+"' np="+np+" hue="+hue+" dhue="+dhue+" dr="+dr+" theta="+theta+" dtheta="+dtheta+" vx="+vx+" vy="+vy+" style='position:absolute;left:"+(6+rnd(w-ss[j]-12))+"px;top:"+(6+rnd(h-ss[j]-12))+"px;height:"+ss[j]+";width:"+ss[j]+";rotation:0;' fill='true' stroke='false' coordsize='2000,2000' coordorigin '0,0' fillcolor='#fdf9ae' strokeweight='2emu' path='"+sp+"'><v:fill type='gradientRadial' color2='#6f6022' angle='45' focus='100%' focusposition='.5,.5' focussize='2,2' method='linear sigma'></v:fill></v:shape>"
}
document.write(vs);
window.setInterval("frame();",20);
function frame(){
for(j=0;j<ss.length;j++){
S=document.all["V"+j];
//animate colour
hue=parseInt(S.hue);
dhue=parseInt(S.dhue);
hue+=dhue;
if(hue>=360)hue-=360;
S.hue=hue;
scol.h=hue;
scol.hsv2rgb();
S.fillcolor=scol.rgb;
//animate rotation
r=parseInt(S.style.rotation);
dr=parseInt(S.dr);
r+=dr;if(r>=360)r-=360;if(r<0)r+=360;
S.style.rotation=r;
//animate geometry
np=parseInt(S.np);
theta=parseFloat(S.theta);
dtheta=parseFloat(S.dtheta);
theta+=dtheta;if(theta>Math.PI)theta-=2*Math.PI;
sp=makestarpath(np,1000,200+1000*Math.sin(theta));
S.path=sp;
S.theta=theta;
//move & bounce stars
x=S.style.pixelLeft;
y=S.style.pixelTop;
vx=parseInt(S.vx);
vy=parseInt(S.vy);
x+=vx;
y+=vy;
if(x<0){vx=-vx;x+=vx;}
if(x>w-ss[j]){vx=-vx;x=2*(w-ss[j])-x;}
if(x>w-ss[j])x=0;
if(x<0)x=0;
if(y<0){vy=-vy;y+=vy;}
if(y>h-ss[j]){vy=-vy;y=2*(h-ss[j])-y;}
if(y>h-ss[j])y=0;
if(y<0)y=0;
S.style.pixelLeft=x;
S.style.pixelTop=y;
S.vx=vx;
S.vy=vy;
}
}
//n=number of points
//r1=outer diameter
//r2=inner diameter
//assumes coordsize='2000,2000' coordorigin '0,0'
function makestarpath(n,r1,r2){
s="";
pa=2*Math.PI/n;
ss1=Math.PI/2;
ss2=ss1-pa/2;
x1=Math.floor(r1*Math.cos(ss1));
y1=Math.floor(-r1*Math.sin(ss1));
x2=Math.floor(r2*Math.cos(ss2));
y2=Math.floor(-r2*Math.sin(ss2));
s="m "+(x2+1000)+","+(y2+1000)+" l ";
for (i=1;i<=n;i++){
if(i>1)s+=","
s+=(x1+1000)+","+(y1+1000)+",";
s1=ss1+i*pa;
s2=ss2+i*pa;
x1=Math.floor(r1*Math.cos(s1));
y1=Math.floor(-r1*Math.sin(s1));
x2=Math.floor(r2*Math.cos(s2));
y2=Math.floor(-r2*Math.sin(s2));
s+=(x2+1000)+","+(y2+1000);
}
s+=" e"
return(s);
}
function rnd(n){
return(Math.floor((n+1)*Math.random()));
}
function resize(){
w=document.body.clientWidth;
h=document.body.clientHeight;
bg.style.width=w;
bg.style.height=h;
}
//utility object for HSV to RGB conversion
function hsv2rgb(){
pqvt=new Array(4);
with(this){
if(s==0){
r=Math.floor(255*v);
g=r;
b=r;
return;
}
if(h>=360)h=0;
nh=h/60;
i=Math.floor(nh);
f=nh-i;
pqvt[2]=255*v;
pqvt[0]=pqvt[2]*(1-s)
pqvt[1]=pqvt[2]*(1-s*f)
pqvt[3]=pqvt[2]*(1-s*(1-f))
r=Math.floor(pqvt[irpnt[i]]);
g=Math.floor(pqvt[igpnt[i]]);
b=Math.floor(pqvt[ibpnt[i]]);
rgb="#"+(65536*r+256*g+b).toString(16);
}
}
function colour(h,s,v){
this.h=h; //0-359
this.s=s; //0-1
this.v=v; //0-1
this.r=0; //0-255
this.g=0; //0-255
this.b=0; //0-255
this.rgb="";
this.hsv2rgb=hsv2rgb;
//convert on construction
this.hsv2rgb();
}
</script>
</BODY></HTML>
方工 2003-01-10
- 打赏
- 举报
Gears within Gears, found in a web site
<HTML xmlns:v = "urn:schemas-microsoft-com:vml"><HEAD>
<TITLE>VML Animation - Gears within Gears</TITLE>
<OBJECT classid=CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E
id=VMLRender></OBJECT>
<STYLE>v\:* {
BEHAVIOR: url(#VMLRender)
}
</STYLE>
</HEAD>
<BODY bgColor=#ffffff onresize=resize() scroll=no>
<div id=op></div>
<script>
//globals for HSV to RGB conversion
irpnt=new Array(2,1,0,0,3,2);
igpnt=new Array(3,2,2,1,0,0);
ibpnt=new Array(0,0,3,2,2,1);
//constants for gears
GB=100;
GD=30;
GA=20;
w=0;
h=0;
kx=0;
ky=0;
scol=new colour(57,.71,.89);
ss=new Array(500,500,500,500,500,500,500,500,500,500,500,500,500,500,500);
vs="<DIV id=kal style='position:absolute;left:"+kx+";top:"+ky+";'>";
for(j=0;j<ss.length;j++){
np=30-2*j;
sp=makegearpath(np);
hue=j*4;
dhue=8;
dr=(j+1)/2;
//if(j%2==0)dr=-dr;
vx=rnd(10)-4;if(vx==0)vx=-5;
vy=rnd(10)-4;if(vy==0)vy=-5;
vs+="<v:shape id='V"+j+"' np="+np+" hue="+hue+" dhue="+dhue+" dr="+dr+" vx="+vx+" vy="+vy+" style='position:absolute;left:"+((500-ss[j])/2)+"px;top:"+((500-ss[j])/2)+"px;height:"+ss[j]+";width:"+ss[j]+";rotation:0;' fill='true' stroke='true' coordsize='2500,2500' coordorigin '-1250,-1250' fillcolor='#fdf9ae' strokecolor='#000000' path='"+sp+"'></v:shape>"
}
vs+="</div>"
document.write(vs);
resize();
window.setInterval("frame();",20);
function frame(){
for(j=0;j<ss.length;j++){
S=document.all["V"+j];
//animate colour
hue=parseInt(S.hue);
dhue=parseInt(S.dhue);
hue+=dhue;
if(hue>=360)hue-=360;
S.hue=hue;
scol.h=hue;
scol.hsv2rgb();
S.fillcolor=scol.rgb;
//S.strokecolor=scol.rgb;
//animate rotation
r=parseFloat(S.style.rotation);
dr=parseFloat(S.dr);
r+=dr;if(r>=360)r-=360;if(r<0)r+=360;
S.style.rotation=r;
}
}
//n=number of points
//r1=outer diameter
//r2=inner diameter
//assumes coordsize='2000,2000' coordorigin '0,0'
function makegearpath(n){
var r1,r2,l1,l2
var theta,phi,alpha,beta
s="";
theta=2*Math.PI/n;
theta2=theta/2
r2=(GB*n)/(2*Math.PI);
r1=r2+GD;
l1=Math.sqrt((r1*r1+GA*GA));
l2=Math.sqrt((r2*r2+GA*GA));
alpha=Math.atan(GA/r1);
beta=Math.atan(GA/r2);
phi=Math.PI/2-theta2-beta;
s="m "+(1250+Math.round(l2*Math.cos(phi)))+","+(1250+Math.round(l2*Math.sin(phi)))+"l";
for (i=0;i<n;i++){
phi=i*theta+Math.PI/2;
if(i>0)s+=",";
s+=(1250+Math.round(l2*Math.cos(phi-theta2+beta)))+","+(1250+Math.round(l2*Math.sin(phi-theta2+beta)))+",";
s+=(1250+Math.round(l1*Math.cos(phi-alpha)))+ ","+(1250+Math.round(l1*Math.sin(phi-alpha)))+",";
s+=(1250+Math.round(l1*Math.cos(phi+alpha)))+ ","+(1250+Math.round(l1*Math.sin(phi+alpha)))+",";
s+=(1250+Math.round(l2*Math.cos(phi+theta2-beta)))+","+(1250+Math.round(l2*Math.sin(phi+theta2-beta)));
}
s+="x e"
return(s);
}
function rnd(n){
return(Math.floor((n+1)*Math.random()));
}
function resize(){
w=document.body.clientWidth;
h=document.body.clientHeight;
// bg.style.width=w;
// bg.style.height=h;
kx=w/2-250;
ky=h/2-250;
kal.style.left=kx;
kal.style.top=ky;
}
//utility object for HSV to RGB conversion
function hsv2rgb(){
pqvt=new Array(4);
with(this){
if(s==0){
r=Math.floor(255*v);
g=r;
b=r;
return;
}
if(h>=360)h=0;
nh=h/60;
i=Math.floor(nh);
f=nh-i;
pqvt[2]=255*v;
pqvt[0]=pqvt[2]*(1-s)
pqvt[1]=pqvt[2]*(1-s*f)
pqvt[3]=pqvt[2]*(1-s*(1-f))
r=Math.floor(pqvt[irpnt[i]]);
g=Math.floor(pqvt[igpnt[i]]);
b=Math.floor(pqvt[ibpnt[i]]);
rgb="#"+(65536*r+256*g+b).toString(16);
}
}
function colour(h,s,v){
this.h=h; //0-359
this.s=s; //0-1
this.v=v; //0-1
this.r=0; //0-255
this.g=0; //0-255
this.b=0; //0-255
this.rgb="";
this.hsv2rgb=hsv2rgb;
//convert on construction
this.hsv2rgb();
}
</script>
</BODY></HTML>
<HTML xmlns:v = "urn:schemas-microsoft-com:vml"><HEAD>
<TITLE>VML Animation - Gears within Gears</TITLE>
<OBJECT classid=CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E
id=VMLRender></OBJECT>
<STYLE>v\:* {
BEHAVIOR: url(#VMLRender)
}
</STYLE>
</HEAD>
<BODY bgColor=#ffffff onresize=resize() scroll=no>
<div id=op></div>
<script>
//globals for HSV to RGB conversion
irpnt=new Array(2,1,0,0,3,2);
igpnt=new Array(3,2,2,1,0,0);
ibpnt=new Array(0,0,3,2,2,1);
//constants for gears
GB=100;
GD=30;
GA=20;
w=0;
h=0;
kx=0;
ky=0;
scol=new colour(57,.71,.89);
ss=new Array(500,500,500,500,500,500,500,500,500,500,500,500,500,500,500);
vs="<DIV id=kal style='position:absolute;left:"+kx+";top:"+ky+";'>";
for(j=0;j<ss.length;j++){
np=30-2*j;
sp=makegearpath(np);
hue=j*4;
dhue=8;
dr=(j+1)/2;
//if(j%2==0)dr=-dr;
vx=rnd(10)-4;if(vx==0)vx=-5;
vy=rnd(10)-4;if(vy==0)vy=-5;
vs+="<v:shape id='V"+j+"' np="+np+" hue="+hue+" dhue="+dhue+" dr="+dr+" vx="+vx+" vy="+vy+" style='position:absolute;left:"+((500-ss[j])/2)+"px;top:"+((500-ss[j])/2)+"px;height:"+ss[j]+";width:"+ss[j]+";rotation:0;' fill='true' stroke='true' coordsize='2500,2500' coordorigin '-1250,-1250' fillcolor='#fdf9ae' strokecolor='#000000' path='"+sp+"'></v:shape>"
}
vs+="</div>"
document.write(vs);
resize();
window.setInterval("frame();",20);
function frame(){
for(j=0;j<ss.length;j++){
S=document.all["V"+j];
//animate colour
hue=parseInt(S.hue);
dhue=parseInt(S.dhue);
hue+=dhue;
if(hue>=360)hue-=360;
S.hue=hue;
scol.h=hue;
scol.hsv2rgb();
S.fillcolor=scol.rgb;
//S.strokecolor=scol.rgb;
//animate rotation
r=parseFloat(S.style.rotation);
dr=parseFloat(S.dr);
r+=dr;if(r>=360)r-=360;if(r<0)r+=360;
S.style.rotation=r;
}
}
//n=number of points
//r1=outer diameter
//r2=inner diameter
//assumes coordsize='2000,2000' coordorigin '0,0'
function makegearpath(n){
var r1,r2,l1,l2
var theta,phi,alpha,beta
s="";
theta=2*Math.PI/n;
theta2=theta/2
r2=(GB*n)/(2*Math.PI);
r1=r2+GD;
l1=Math.sqrt((r1*r1+GA*GA));
l2=Math.sqrt((r2*r2+GA*GA));
alpha=Math.atan(GA/r1);
beta=Math.atan(GA/r2);
phi=Math.PI/2-theta2-beta;
s="m "+(1250+Math.round(l2*Math.cos(phi)))+","+(1250+Math.round(l2*Math.sin(phi)))+"l";
for (i=0;i<n;i++){
phi=i*theta+Math.PI/2;
if(i>0)s+=",";
s+=(1250+Math.round(l2*Math.cos(phi-theta2+beta)))+","+(1250+Math.round(l2*Math.sin(phi-theta2+beta)))+",";
s+=(1250+Math.round(l1*Math.cos(phi-alpha)))+ ","+(1250+Math.round(l1*Math.sin(phi-alpha)))+",";
s+=(1250+Math.round(l1*Math.cos(phi+alpha)))+ ","+(1250+Math.round(l1*Math.sin(phi+alpha)))+",";
s+=(1250+Math.round(l2*Math.cos(phi+theta2-beta)))+","+(1250+Math.round(l2*Math.sin(phi+theta2-beta)));
}
s+="x e"
return(s);
}
function rnd(n){
return(Math.floor((n+1)*Math.random()));
}
function resize(){
w=document.body.clientWidth;
h=document.body.clientHeight;
// bg.style.width=w;
// bg.style.height=h;
kx=w/2-250;
ky=h/2-250;
kal.style.left=kx;
kal.style.top=ky;
}
//utility object for HSV to RGB conversion
function hsv2rgb(){
pqvt=new Array(4);
with(this){
if(s==0){
r=Math.floor(255*v);
g=r;
b=r;
return;
}
if(h>=360)h=0;
nh=h/60;
i=Math.floor(nh);
f=nh-i;
pqvt[2]=255*v;
pqvt[0]=pqvt[2]*(1-s)
pqvt[1]=pqvt[2]*(1-s*f)
pqvt[3]=pqvt[2]*(1-s*(1-f))
r=Math.floor(pqvt[irpnt[i]]);
g=Math.floor(pqvt[igpnt[i]]);
b=Math.floor(pqvt[ibpnt[i]]);
rgb="#"+(65536*r+256*g+b).toString(16);
}
}
function colour(h,s,v){
this.h=h; //0-359
this.s=s; //0-1
this.v=v; //0-1
this.r=0; //0-255
this.g=0; //0-255
this.b=0; //0-255
this.rgb="";
this.hsv2rgb=hsv2rgb;
//convert on construction
this.hsv2rgb();
}
</script>
</BODY></HTML>
blues-star 2003-01-10
- 打赏
- 举报
111111111111
我记得我也来了，怎么没看到留名呢？
生日快乐：）^^
我记得我也来了，怎么没看到留名呢？
生日快乐：）^^
Andrawu 2003-01-10
- 打赏
- 举报
Happy Birthday!!!
顺便学习，对vml不了解，能不能说说vml主要用于哪方面，有什么好处？
顺便学习，对vml不了解，能不能说说vml主要用于哪方面，有什么好处？
baitianhai 2003-01-10
- 打赏
- 举报
祝emu生日快乐,学习学习
加载更多回复（10）
