HTML+TIME学习笔记（四）

莺燕音画 发表于 2008-8-7 14:21

第四课
 上节讲解了颜色的变化，那这节就让我来讲下形状的变化。
先来看看例子：
<A href="http://roger01rao.ik8.com/htmlntime/jiaocheng/教程4.html">点击看效果</A>
接下来看代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML XMLNS:t="urn:schemas-microsoft-com:time"> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=gb2312"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>黄莺语柳紫燕归梁</TITLE> <STYLE type="text/css">  </STYLE> <?IMPORT namespace="t" implementation="#default#time2"> </HEAD> <BODY> 
<img id="t1" src="<A href="http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg">http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg</A>" style="width:0; height:0; position:absolute; left:0; top:0;"> <t:animate id="large1" targetElement="t1" attributeName="width" from="0" to="500" begin="1" dur="3" fill="hold" /> <t:animate id="large2" targetElement="t1" attributeName="height" from="0" to="398" begin="large1.begin" dur="3" fill="hold" />
 </BODY> </HTML> 
 效果描述:就是让这个图片从0.0位置逐渐变化到500.398坐标。
 这里与前面代码不同的无非就是<t:animate/>标记，这个标记是用来连续性变化图像大小的，其他属性前面都讲过了，这里只是重复应用罢了。
 这里我给大家留个作业：这里的形状变化是从左上角开始到右下脚的，如何做到从中间逐渐放大到两边呢？希望大家能做这个练习，并发表在回复里。

雨后斜阳 发表于 2008-8-7 16:53

等有时间来交作业！

白雪皑皑 发表于 2008-8-7 17:57

我先学习，然后交作业。

快乐相随 发表于 2008-8-8 01:12

交作业
<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\"> <HTML XMLNS:t=\"urn:schemas-microsoft-com:time\"> <HEAD> <META http-equiv=\"Content-Type\" content=\"text/html; charset=gb2312\"> <META http-equiv=\"Content-Style-Type\" content=\"text/css\"> <TITLE>黄莺语柳紫燕归梁</TITLE> <STYLE type=\"text/css\">  </STYLE> <?IMPORT namespace=\"t\" implementation=\"#default#time2\"> </HEAD> <BODY> <img id=\"t1\" src=\"<A href=\"http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg\">http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg</A>\" style=\"width:0; height:0; position:absolute; left:500; top:400;\"> <t:animate id=\"large1\" targetElement=\"t1\" attributeName=\"width\" from=\"0\" to=\"500\" begin=\"1\" dur=\"3\" fill=\"hold\" /> <t:animate id=\"large2\" targetElement=\"t1\" attributeName=\"height\" from=\"0\" to=\"398\" begin=\"large1.begin\" dur=\"3\" fill=\"hold\" /> </BODY> </HTML>

快乐相随 发表于 2008-8-8 01:18

试验了作业好象图片停留时间短了点，位置不够居中，麻烦老师看看需要修改什么？

ヤ;聆聽浪漫 发表于 2008-8-8 17:41

先学习！！！！！！！！

文子发表于 2008-8-8 22:37

留个脚印，有时间来学习

水若寒 发表于 2008-10-2 22:10

<IMG id=t1 style=\"LEFT: 500px; WIDTH: 0px; POSITION: absolute; TOP: 398px; HEIGHT: 0px\" src=\"http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg\"> <!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\"> <HTML XMLNS:t=\"urn:schemas-microsoft-com:time\"> <HEAD> <META http-equiv=\"Content-Type\" content=\"text/html; charset=gb2312\"> <META http-equiv=\"Content-Style-Type\" content=\"text/css\"> <TITLE>水若寒来学习~</TITLE> <STYLE type=\"text/css\">  </STYLE> <?IMPORT namespace=\"t\" implementation=\"#default#time2\"> </HEAD> <BODY> 
<img id=\"t1\" src=\"<A href=\"http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg\">http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg</A>\" style=\"width:0; height:0; position:absolute; 
left:500; top:398;\"> <t:animate id=\"large1\" targetElement=\"t1\" attributeName=\"width\" from=\"0\" to=\"500\" begin=\"1\" dur=\"3\" fill=\"hold\" /> <t:animate id=\"large2\" targetElement=\"t1\" attributeName=\"height\" from=\"0\" to=\"398\" begin=\"large1.begin\" dur=\"3\" fill=\"hold\" 
/>
 </BODY> </HTML>
 <?import namespace = t urn = \"urn:schemas-microsoft-com:time\" implementation = \"#default#time2\" declareNamespace /><t:animate id=large1 attributeName = \"width\" from = \"0\" targetElement = \"t1\" to = \"500\" begin = \"1\" dur = \"3\" ></t:animate><t:animate id=large2 attributeName = \"height\" from = \"0\" targetElement = \"t1\" to = \"398\" begin = \"large1.begin\" dur = \"3\" ></t:animate> 

[ 本帖最后由水若寒于 2008-10-2 22:15 编辑 ]

水若寒 发表于 2008-10-2 22:17

请教一下楼主哦，为什么我做成代码它还在上面出现？是我做的？

shjhw 发表于 2008-10-3 17:00

回复 1# 的帖子

先学学，好象很难，学会了交作业

页: [1] 2

中画网's Archiver

HTML+TIME学习笔记（四）

回复 1# 的帖子