HTML+TIME学习笔记（一）

莺燕音画 发表于 2008-8-6 18:59

我发过一些html+time的帖子，有些朋友不太明白，要求给出个教程。本人也是初学，因此不能算作教程，只能算是一些学习经验吧。好了废话就不说了，转入正题吧！
 
<SPAN style="FONT-SIZE: 12pt; COLOR: black; FONT-FAMILY: 宋体; mso-ascii-font-family: papyrus; mso-hansi-font-family: papyrus; mso-bidi-font-family: 宋体; mso-ansi-language: EN-US; mso-fareast-language: ZH-CN; mso-bidi-language: AR-SA">第一节
<SPAN style="FONT-SIZE: 12pt; COLOR: black; FONT-FAMILY: 宋体; mso-ascii-font-family: papyrus; mso-hansi-font-family: papyrus; mso-bidi-font-family: 宋体; mso-ansi-language: EN-US; mso-fareast-language: ZH-CN; mso-bidi-language: AR-SA"> <SPAN style="FONT-SIZE: 12pt; COLOR: black; FONT-FAMILY: 宋体; mso-ascii-font-family: papyrus; mso-hansi-font-family: papyrus; mso-bidi-font-family: 宋体; mso-ansi-language: EN-US; mso-fareast-language: ZH-CN; mso-bidi-language: AR-SA">
HTML+TIME，是由Microsoft公司开发的东西,，我们用的HTML+TIME (2.0)，如果不是在IE5.5以上的浏览器，不能正常看，不过我想大家的IE应该都在6以上了吧？对不对？
 为了吸引大家，首先来说说它的优点： ①比JS脚本容易理解，容易自如运用。 ②可以按照自己的想象用简单的代码实现复杂的效果。
 首先，我要声明一点，就是我这里讲的不是照论坛UBB代码格式，而是按照HTML网页模式的。好了，现在开始吧：
 首先，代码头文件必须包含以下代码：
 <!DOCTYPE HTML PUBLIC "-//W<?xml:namespace prefix = st1 ns = "urn:schemas-microsoft-com:office:smarttags" /><st1:chmetcnv w:st="on" TCSC="0" NumberType="1" Negative="False" HasSpace="False" SourceValue="3" UnitName="C">3C</st1:chmetcnv>//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(或者unicode或者<SPAN lang=EN-US style="FONT-SIZE: 12pt; COLOR: black; FONT-FAMILY: papyrus; mso-bidi-font-family: 宋体; mso-ansi-language: EN-US; mso-fareast-language: ZH-CN; mso-bidi-language: AR-SA; mso-fareast-font-family: 宋体">Shift_JIS)"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE></TITLE> <STYLE type="text/css">  </STYLE> <?IMPORT namespace="t" implementation="#default#time2"> </HEAD> <?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" /><o:p></o:p>
<BODY><o:p></o:p>
<o:p></o:p>
</BODY><o:p></o:p>
 </HTML> 
<o:p></o:p> 
下面就让我们来看一个简单的例子,大家请看效果:
 
<A href="http://roger01rao.ik8.com/htmlntime/jiaocheng/教程1.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="image1" src="<A href="http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg">http://roger01rao.ik8.com/htmlntime/jiaocheng/05a.jpg</A>" style="position:absolute; left:0; top:0;" class="time" 
begin="0" end="4"> <IMG id="image2" src="<A href="http://roger01rao.ik8.com/htmlntime/jiaocheng/06a.jpg">http://roger01rao.ik8.com/htmlntime/jiaocheng/06a.jpg</A>" style="position:absolute; left:400; top:400;" 
class="time" begin="2" end="6">
 </BODY> </HTML>
 
 这个比前面多了什么呢？不就是多了红色部分的几行嘛！这里让我来解释下，首先ID表示名字，譬如我叫黄莺语柳，然后你可以叫黄莺语柳去干什么，譬如叫黄莺语柳去打球，那我这里也就可以这么来写了，image1.begin，表示图像一开始的意思，就是确定个对象然后让它干什么，接下来的是图片的绝对地址，就不用多说了。然后整句STYLE就是对图片的绝对定位，关于绝对定位的具体理解请大家看我另外的帖子，CLASS表示类型，譬如这个是关于时间的，既然关于时间的，当然有显示和结束咯，begin表示开始，end表示结束， begin="0" end="4"表示0秒开始，4秒消失的意思。就这么简单，一个按时间分布显示的动画就出来拉！ 
 题外话：当然这个不仅仅适用于图片，还适用于表格，事件，层等各类标签，大家可以尝试下。 这是第一节，希望大家看了给我点意见，如果我有时间的话将继续写下去。<o:p></o:p>
 

[ 本帖最后由 roger01rao 于 2008-8-6 19:03 编辑 ]

skyline 发表于 2008-8-6 20:10

好东东，谢谢分享。

莺燕音画 发表于 2008-8-7 10:41

既然没有人留言提意见，那就不继续了，如果有需要我再写吧。

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

很实用的教材！

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

我收藏了，慢慢研究去。

一剑飘香红 发表于 2008-8-7 17:48

这么好的东东,一定要顶上去

莺燕音画 发表于 2008-8-7 19:40

我本来想全部发在一起的，可是那样太费时间，所有这样简单一点，就偷点懒了。

快乐相随 发表于 2008-8-8 00:03

说得很详细，是很实用的教材，再来学习一下。建议黄莺语柳连在一起发个完整教材，可以在网络中流传了。

莺燕音画 发表于 2008-8-8 01:20

我把它发完了，在在一个页面中作连接就行了，这样大家看起来也方便些。不过得等以后有时间了。

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

从第一章开始学起！！！先收藏！！

页: [1] 2 3 4

中画网's Archiver

HTML+TIME学习笔记（一）