梦里柳地 发表于 2008-10-9 13:53

【老兵HTML+TIME特效】边疆处处赛江南/和代码解析

梦里柳地 发表于 2008-10-9 14:02

老兵原妖妖娱乐论坛音画斑竹.喜爱音乐喜欢歌唱.为人忠厚正直.现已离开妖妖论坛.但在其他论坛继续发表作品.他做的这个<边疆处处赛江南>明显的学习了笑谈老师的HTML+TIME特效.但增加了歌词同步代码.现转在这里.

供欣赏和学习.

全代码如下(说明文字是我加的)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML xmlns:v = "urn:schemas-microsoft-com:vml" xmlns:t =
"urn:schemas-microsoft-com:time"><HEAD><TITLE>老兵音画《边疆处处赛江南》</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<META http-equiv=Content-Style-Type content=text/css>
<META content="MSHTML 6.00.2800.1561" name=GENERATOR>
<META http-equiv=imagetoolbar content=no>
<STYLE>.time {
BEHAVIOR: url(#default#time2)
}
t\:* {
BEHAVIOR: url(#default#time2)
}
v\:* {
BEHAVIOR: url(#default#VML)
}
</STYLE>
</HEAD>

<img id="image3" src="http://image.hnol.net/200504/laobing/67/1.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="25" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image3" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image3.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image3" type="fade" subtype="crossFade" mode="in" begin="image3.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image3" type="fade" subtype="crossFade" mode="out" begin="image3.begin+15" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<img id="image4"
src="http://image.hnol.net/200504/laobing/67/2.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="40" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image4" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image4.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image4" type="fade" subtype="crossFade" mode="in" begin="image4.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image4" type="fade" subtype="crossFade" mode="out" begin="image4.begin+15" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<img id="image5"
src="http://image.hnol.net/200504/laobing/67/3.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="55" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image5" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image5.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image5" type="fade" subtype="crossFade" mode="in" begin="image5.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image5" type="fade" subtype="crossFade" mode="out" begin="image5.begin+15" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<img id="image6"
src="http://image.hnol.net/200504/laobing/67/4.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="60" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image6" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image1.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image6" type="fade" subtype="crossFade" mode="in" begin="image6.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image6" type="fade" subtype="crossFade" mode="out" begin="image6.begin+15" dur="5" autoreverse="false" repeatcount="1" />

<IMG class=time
id=b3 style="LEFT: 0px; POSITION: absolute; TOP: 0px"
src="http://image.hnol.net/200504/laobing/67/1.jpg" begin = "b3.begin+130" dur = "12">
<t:transitionFilter id=GradientWipe1 from = "0" targetElement = "b3" to = "1"
type = "progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode =
"in" autoReverse = "false" begin = "b3.begin" dur = "20" repeatCount =
"1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0" targetElement =
"b3" to = "1" type = "fade" subType = "crossFade" mode = "in" autoReverse =
"false" begin = "b3.begin" dur = "3" repeatCount =
"1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0" targetElement =
"b3" to = "1" type = "fade" subType = "crossFade" mode = "out" autoReverse =
"false" begin = "b3.begin+7" dur = "5" repeatCount =
"1"></t:transitionFilter>

<IMG class=time
id=b4 style="LEFT: 400px; POSITION: absolute; TOP: 290px"
src="http://image.hnol.net/200504/laobing/67/1.gif" begin = "b1.begin+13" dur = "12">
<t:transitionFilter id=GradientWipe1 from = "0" targetElement = "b4" to = "1"
type = "progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode =
"in" autoReverse = "false" begin = "b4.begin" dur = "5" repeatCount =
"1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0" targetElement =
"b4" to = "1" type = "fade" subType = "crossFade" mode = "in" autoReverse =
"false" begin = "b4.begin" dur = "3" repeatCount =
"1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0" targetElement =
"b4" to = "1" type = "fade" subType = "crossFade" mode = "out" autoReverse =
"false" begin = "b4.begin+7" dur = "5" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=b5
style="FILTER: alpha(Opacity=125); LEFT: 180px; WIDTH: 80px;
POSITION: absolute; TOP: 240px; HEIGHT: 40px" height=400
src="http://image.hnol.net/200504/laobing/67/q2.gif" width=80 begin =
"image2.begin+20" dur = "18"> <t:animateMotion id=am3 from = "0,0" targetElement =
"b5" to = "10,100" begin = "b5.begin+2" dur = "18" fill =
"hold"></t:animateMotion><t:transitionFilter id=fade1 from = "0" targetElement =
"b5" to = "1" type = "fade" subType = "crossFade" mode = "out" autoReverse =
"false" begin = "b5.begin+15" dur = "3" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=b6
style="FILTER: alpha(Opacity=125); LEFT: 996px; POSITION: absolute; TOP: 215px"
src="http://image.hnol.net/200504/laobing/67/3.gif" begin = "image3.begin+2" dur = "40">
<t:animateMotion id=am1 from = "0,0" targetElement = "b6" to = "-1100,10" begin
= "b6.begin" dur = "35" fill = "hold"></t:animateMotion><t:transitionFilter
id=fade1 from = "0" targetElement = "b6" to = "1" type = "fade" subType =
"crossFade" mode = "in" autoReverse = "false" begin = "b6.begin" dur = "3"
repeatCount = "1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0"
targetElement = "b6" to = "1" type = "fade" subType = "crossFade" mode = "out"
autoReverse = "false" begin = "b6.begin+35" dur = "5" repeatCount =
"1"></t:transitionFilter>

<img id="image11"
src="http://image.hnol.net/200504/laobing/67/1.gif" style="position:absolute; left:0px; top:0;" class="time" begin="135" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image1" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image1.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade11" targetElement="image11" type="fade" subtype="crossFade" mode="in" begin="image11.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade11" targetElement="image11" type="fade" subtype="crossFade" mode="out" begin="image11.begin+15" dur="5" autoreverse="false" repeatcount="1" />

<img id="image21"
src="http://image.hnol.net/200504/laobing/67/2.gif" style="position:absolute; left:720px; top:165px;" class="time" begin="150" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image21" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image21.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image21" type="fade" subtype="crossFade" mode="in" begin="image21.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image21" type="fade" subtype="crossFade" mode="out" begin="image21.begin+15" dur="5" autoreverse="false" repeatcount="1" />

<img id="image31"
src="http://image.hnol.net/200504/laobing/67/9.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="165" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image31" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image3.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image31" type="fade" subtype="crossFade" mode="in" begin="image31.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image31" type="fade" subtype="crossFade" mode="out" begin="image31.begin+15" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<img id="image41"
src="http://image.hnol.net/200504/laobing/67/10.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="180" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image41" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image4.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image41" type="fade" subtype="crossFade" mode="in" begin="image41.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image41" type="fade" subtype="crossFade" mode="out" begin="image41.begin+15" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<img id="image51"
src="http://image.hnol.net/200504/laobing/67/11.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="195" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image5" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image5.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image51" type="fade" subtype="crossFade" mode="in" begin="image51.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image51" type="fade" subtype="crossFade" mode="out" begin="image51.begin+15" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<img id="image61"
src="http://image.hnol.net/200504/laobing/67/12.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="210" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image61" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image1.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image61" type="fade" subtype="crossFade" mode="in" begin="image61.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image61" type="fade" subtype="crossFade" mode="out" begin="image61.begin+15" dur="5" autoreverse="false" repeatcount="1" />

<img id="image71"
src="http://image.hnol.net/200504/laobing/67/13.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="225" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image7" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image7.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image71" type="fade" subtype="crossFade" mode="in" begin="image71.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image71" type="fade" subtype="crossFade" mode="out" begin="image71.begin+15" dur="5" autoreverse="false" repeatcount="1" />

<img id="image81"
src="http://image.hnol.net/200504/laobing/67/1.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="240" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image8" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image81.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image81" type="fade" subtype="crossFade" mode="in" begin="image81.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image81" type="fade" subtype="crossFade" mode="out" begin="image81.begin+150" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<img id="image91"
src="http://image.hnol.net/200504/laobing/67/14.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="255" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image91" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image91.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image91" type="fade" subtype="crossFade" mode="in" begin="image91.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image91" type="fade" subtype="crossFade" mode="out" begin="image91.begin+150" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<img id="image100"
src="http://image.hnol.net/200504/laobing/67/15.jpg" style="position:absolute; left:0px; top:0;" class="time" begin="275" dur="20">
<t:transitionFilter id="GradientWipe1" targetElement="image100" type="progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode="in" begin="image100.begin" dur="5" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image100" type="fade" subtype="crossFade" mode="in" begin="image100.begin" dur="3" autoreverse="false" repeatcount="1" />
<t:transitionFilter id="fade1" targetElement="image100" type="fade" subtype="crossFade" mode="out" begin="image100.begin+150" dur="5" autoreverse="false" repeatcount="1" />
</t:transitionFilter>

<IMG class=time id=b31
style="LEFT: 0px; POSITION: absolute; TOP: 0px"
src="http://image.hnol.net/200504/laobing/67/4.jpg" begin = "b1.begin+130" dur = "12">
<t:transitionFilter id=GradientWipe1 from = "0" targetElement = "b31" to = "1"
type = "progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode =
"in" autoReverse = "false" begin = "b31.begin" dur = "5" repeatCount =
"1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0" targetElement =
"b31" to = "1" type = "fade" subType = "crossFade" mode = "in" autoReverse =
"false" begin = "b31.begin" dur = "3" repeatCount =
"1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0" targetElement =
"b31" to = "1" type = "fade" subType = "crossFade" mode = "out" autoReverse =
"false" begin = "b31.begin+7" dur = "5" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=b41
style="LEFT: 400px; POSITION: absolute; TOP: 290px"
src="http://image.hnol.net/200504/laobing/67/1.gif" begin = "b1.begin+130" dur = "12">
<t:transitionFilter id=GradientWipe1 from = "0" targetElement = "b41" to = "1"
type = "progid:DXImageTransform.Microsoft.GradientWipe(gradientsize=1.5)" mode =
"in" autoReverse = "false" begin = "b41.begin" dur = "5" repeatCount =
"1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0" targetElement =
"b41" to = "1" type = "fade" subType = "crossFade" mode = "in" autoReverse =
"false" begin = "b41.begin" dur = "3" repeatCount =
"1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0" targetElement =
"b41" to = "1" type = "fade" subType = "crossFade" mode = "out" autoReverse =
"false" begin = "b41.begin+7" dur = "5" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=b51
style="FILTER: alpha(Opacity=125); LEFT:180px; WIDTH: 80px;
POSITION: absolute; TOP: 40px; HEIGHT: 40px" height=360
src="http://image.hnol.net/200504/laobing/67/q2.gif" width=80 begin =
"image2.begin+160" dur = "18"> <t:animateMotion id=am3 from = "0,0" targetElement =
"b51" to = "10,100" begin = "b51.begin+2" dur = "18" fill =
"hold"></t:animateMotion><t:transitionFilter id=fade1 from = "0" targetElement =
"b51" to = "1" type = "fade" subType = "crossFade" mode = "out" autoReverse =
"false" begin = "b51.begin+15" dur = "3" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=b61
style="FILTER: alpha(Opacity=125); LEFT: 996px; POSITION: absolute; TOP: 215px"
src="http://image.hnol.net/200504/laobing/67/m.gif" begin = "image3.begin+162" dur = "40">
<t:animateMotion id=am1 from = "0,0" targetElement = "b61" to = "-1100,10" begin
= "b61.begin" dur = "35" fill = "hold"></t:animateMotion><t:transitionFilter
id=fade1 from = "0" targetElement = "b61" to = "1" type = "fade" subType =
"crossFade" mode = "in" autoReverse = "false" begin = "b61.begin" dur = "3"
repeatCount = "1"></t:transitionFilter><t:transitionFilter id=fade1 from = "0"
targetElement = "b61" to = "1" type = "fade" subType = "crossFade" mode = "out"
autoReverse = "false" begin = "b61.begin+35" dur = "5" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=bl1
style="Z-INDEX: 2; FILTER: alpha(Opacity=100); LEFT: 40px; POSITION: absolute; TOP: 40px"
src="http://image.hnol.net/200504/laobing/67/y.gif" begin
= "20" end = ""><t:animatemotion id=kyokusen1 path =
"m 0 0 c 396 -154 500 455 1055 -70" targetElement = "bl1" autoReverse = "false"
begin = "0" dur = "30" fill = "hold" repeatCount =
"10"></t:animatemotion><t:transitionFilter from = "0" targetElement = "bl1" to =
"1" type = "fade" subType = "crossFade" mode = "out" autoReverse = "true" begin
= "bl1.begin+10" dur = "3" repeatCount =
"indefinite"></t:transitionFilter><t:transitionFilter id=fade1 from = "0"
targetElement = "table2" to = "1" type = "fade" subType = "crossFade" mode =
"in" autoReverse = "false" begin = "table2.begin" dur = "3" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=bl2
style="Z-INDEX: 2; FILTER: alpha(Opacity=100); LEFT: -70px; POSITION: absolute; TOP: 160px"
src="http://image.hnol.net/200504/laobing/67/y.gif" begin
= "45" end = ""><t:animatemotion id=kyokusen1 path =
"m 0 0 c 386 -154 580 495 1055 -100" targetElement = "bl2" autoReverse = "false"
begin = "0" dur = "30" fill = "hold" repeatCount =
"10"></t:animatemotion><t:transitionFilter from = "0" targetElement = "bl2" to =
"1" type = "fade" subType = "crossFade" mode = "out" autoReverse = "true" begin
= "bl2.begin+12" dur = "3" repeatCount =
"indefinite"></t:transitionFilter><t:transitionFilter id=fade1 from = "0"
targetElement = "table2" to = "1" type = "fade" subType = "crossFade" mode =
"in" autoReverse = "false" begin = "table2.begin" dur = "3" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=bl3
style="Z-INDEX: 2; FILTER: alpha(Opacity=100); LEFT: -50px; POSITION: absolute; TOP: 120px"
src="http://image.hnol.net/200504/laobing/67/y.gif" begin
= "55" end = ""><t:animatemotion id=kyokusen1 path =
"m 0 0 c 396 -154 500 455 1055 -70" targetElement = "bl3" autoReverse = "false"
begin = "0" dur = "30" fill = "hold" repeatCount =
"10"></t:animatemotion><t:transitionFilter from = "0" targetElement = "bl3" to =
"1" type = "fade" subType = "crossFade" mode = "out" autoReverse = "true" begin
= "bl3.begin+14" dur = "3" repeatCount =
"indefinite"></t:transitionFilter><t:transitionFilter id=fade1 from = "0"
targetElement = "table2" to = "1" type = "fade" subType = "crossFade" mode =
"in" autoReverse = "true" begin = "table2.begin" dur = "3" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=bl4
style="Z-INDEX: 2; FILTER: alpha(Opacity=100); LEFT: -90px; POSITION: absolute; TOP: 180px"
src="http://image.hnol.net/200504/laobing/67/z.gif" begin = "60" end = ""><t:animatemotion id=kyokusen1 path =
"m 0 0 c 386 -154 580 495 1055 -100" targetElement = "bl3" autoReverse = "false"
begin = "0" dur = "30" fill = "hold" repeatCount =
"10"></t:animatemotion><t:transitionFilter from = "0" targetElement = "bl4" to =
"1" type = "fade" subType = "crossFade" mode = "out" autoReverse = "true" begin
= "bl4.begin+16" dur = "3" repeatCount =
"indefinite"></t:transitionFilter><t:transitionFilter id=fade1 from = "0"
targetElement = "table2" to = "1" type = "fade" subType = "crossFade" mode =
"in" autoReverse = "false" begin = "table2.begin" dur = "3" repeatCount =
"1"></t:transitionFilter>

<IMG class=time id=image3c
style="FILTER: alpha(Opacity=40); LEFT: 73px; POSITION: absolute; TOP: 470px"
height=100
src="http://image.hnol.net/200504/laobing/67/q.gif" width=45 begin = "image1.begin+40" dur = "60">
<t:transitionFilter id=fade1 from = "0" targetElement = "image3c" to = "1" type = "fade" subType = "crossFade"
mode = "in" autoReverse = "false" begin = "image3c.begin" dur = "3" repeatCount
= "1"></t:transitionFilter>

<t:animateMotion id=am1 from = "0,0" targetElement =
"image3c" to = "0,-440" begin = "image1.begin+45" dur = "28" fill =
"hold"></t:animateMotion><t:transitionFilter id=fade1 from = "0" targetElement =
"image3c" to = "1" type = "fade" subType = "crossFade" mode = "out" autoReverse
= "false" begin = "image3c.begin+57" dur = "3" repeatCount =
"1"></t:transitionFilter><IMG class=time id=h1
style="Z-INDEX: 1; LEFT: -30px; POSITION: absolute; TOP: 210px"
src="http://image.hnol.net/200504/laobing/67/y.gif" begin
= "5">

<t:animateMotion id=am1 path = " m 30 -46 c 378 -159 100 525 1075 -196"
targetElement = "h1" begin = "h1.begin+6" dur = "30" fill =
"hold"></t:animateMotion><IMG class=time id=h2
style="FILTER: alpha(Opacity=100); LEFT: -85px; POSITION: absolute; TOP: 220px"
src="http://image.hnol.net/200504/laobing/67/z.gif" begin
= "5"><t:animateMotion id=am1 path = " m 30 -46 c 360 -159 100 525 1075 -196"
targetElement = "h2" begin = "h2.begin+6" dur = "30" fill =
"hold"></t:animateMotion>

<CENTER>
<OBJECT id=aboutplayer height=0 width=0
classid=clsid:6bf52a52-394a-11d3-b153-00c04f79faa6 ?><PARAM NAME="AutoStart" VALUE="-1"><PARAM NAME="Balance" VALUE="-1"><PARAM NAME="enabled" VALUE="-1"><PARAM NAME="EnableContextMenu" VALUE="-1"><PARAM NAME="url" VALUE="xzcao_bjccsjn.wma">
<PARAM NAME="PlayCount" VALUE="1"><PARAM NAME="rate" VALUE="1"><PARAM NAME="currentPosition" VALUE="-1"><PARAM NAME="currentMarker" VALUE="-1"><PARAM NAME="defaultFrame" VALUE="-1"><PARAM NAME="invokeURLs" VALUE="0"><PARAM NAME="baseURL" VALUE=""><PARAM NAME="stretchToFit" VALUE="-1"><PARAM NAME="volume" VALUE="100"><PARAM NAME="mute" VALUE="0"><PARAM NAME="uiMode" VALUE="mini"><PARAM NAME="windowlessVideo" VALUE="0"><PARAM NAME="fullScreen" VALUE="0"><PARAM NAME="enableErrorDialogs" VALUE="-1"><PARAM NAME="SAMIStyle" VALUE=""><PARAM NAME="SAMILang" VALUE=""><PARAM NAME="SAMIFilename" VALUE=""></OBJECT></CENTER></DIV><SPAN id=lrcdata></SPAN>

<TABLE id=tab
style="BACKGROUND: url(.jpg); FILTER: progid:DXImageTransform.Microsoft.Matrix; LEFT: 0px; WIDTH: 0px; POSITION: relative; TOP: 0px; HEIGHT: 0px"
cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD align=middle><!br>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD align=middle><SPAN id=lrcbox
style="COLOR:#7FE6F9; HEIGHT: 20px"></SPAN></TD></TR>
<TR style="Z-INDEX: 6; POSITION: relative; TOP: -20px">
<TD noWrap>
<DIV class=time id=lrcbc
style="FILTER: blur(add=1,direction=40,strength=2); OVERFLOW: hidden; WIDTH: 0px;COLOR:#FAF704; HEIGHT: 0px; end: 65"
begin =
"0"></DIV></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV>

<t:animateMotion
id=tab1-1 from = "0,0" targetElement = "tab1" to = "-320,-440" begin = "5" dur =
"5" fill = "hold"></t:animateMotion>
<SCRIPT language=JavaScript>
ffbb=+0.2;
lrcobj=new lrcClass(lrcdata.innerHTML.slice(4,-3));
function lrcClass(tt)
{
this.inr=[];
this.oTime=0;
this.dte=-1;
tt=tt.replace(/\[[^\[\]]*\:[^\[\]]*[^\[\]\d\.]+[^\[\]]*\]/g,"");
while(/\[[^\[\]]+\:[^\[\]]+\]/.test(tt))
{
tt=tt.replace(/((\[[^\[\]]+\:[^\[\]]+\])+[^\[\r\n]*)[^\[]*/,"\n");
var zzzt=RegExp.$1;
    /^(.+\])([^\]]*)$/.exec(zzzt);
var ltxt=RegExp.$2;
var eft=RegExp.$1.slice(1,-1).split("][");
for(var ii=0; ii<eft.length; ii++)
    {
      var sf=eft[ii].split(":");
      var tse=parseInt(sf[0],10)*60+parseFloat(sf[1]);
      var sso={t:[] , w:[] , n:ltxt}
      sso.t[0]=tse-this.oTime;
      this.inr[this.inr.length]=sso;
    }
}
for(var ii=0; ii<this.inr.length; ii++)
{
    while(/<[^<>]+\:[^<>]+>/.test(this.inr[ii].n))
    {
      this.inr[ii].n=this.inr[ii].n.replace(/<(\d+)\:([\d\.]+)>/,"%=%");
      var tse=parseInt(RegExp.$1,10)*60+parseFloat(RegExp.$2);
      this.inr[ii].t[this.inr[ii].t.length]=tse-this.oTime;
    }
    lrcbc.innerHTML="<font>"+this.inr[ii].n.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/%=%/g,"</font><font>")+" </font>";
    var fall=lrcbc.getElementsByTagName("font");
for(var wi=0; wi<fall.length; wi++)
    this.inr[ii].w[this.inr[ii].w.length]=fall[wi].offsetWidth;
    this.inr[ii].n=lrcbc.innerText;
}

this.run=function(tme)
{
    {
      var ii;
      for(ii=this.inr.length-1; ii>=0 && this.inr[ii].t[0]>tme; ii--){}
      if(ii<0) return;
      this.ddh=this.inr[ii].t;
      this.fjh=this.inr[ii].w;
      this.dte=(ii<this.inr.length-1)?this.inr[ii+1].t
[0]:aboutplayer.currentMedia.duration;
      this.print(this.retxt(ii));
    }
    var bbw=0;
    var ki;
    for(ki=0; ki<this.ddh.length && this.ddh[ki]<=tme; ki++)
    bbw+=this.fjh[ki];
    var kt=ki-1;
    var sc=((ki<this.ddh.length)?this.ddh[ki]:this.dte)-this.ddh[kt];
    var tc=tme-this.ddh[kt];
    bbw-=this.fjh[kt]-tc/sc * this.fjh[kt];
    if(bbw>lrcbox.offsetWidth)
    bbw=lrcbox.offsetWidth;
    lrcbc.style.width=Math.round(bbw);
}
this.retxt=function(i)
{
return(i<0 || i>=this.inr.length)?"":this.inr.n;
}
this.print=function(txt)
{
    lrcbox.innerText=txt;
    lrcbc.innerText=txt;
}
}
function lrcrun()
{
with(aboutplayer)
{
lrcobj.run(controls.currentPosition+ffbb);
}
setTimeout("lrcrun()",10);
}
lrcrun();
</SCRIPT>
<CENTER></CENTER></BODY></HTML>

[[i] 本帖最后由梦里柳地于 2008-10-9 15:33 编辑 ]

凤舞雨季 发表于 2008-10-9 14:09

代码看看的晕晕的

凤舞雨季 发表于 2008-10-9 14:09

帖子很棒

凤舞雨季 发表于 2008-10-9 14:10

可惜雨季好笨学不来

凤舞雨季 发表于 2008-10-9 14:10

[:dd51:] [:dd51:]

梦里柳地 发表于 2008-10-9 14:25

代码看看的晕晕的 /认真看看.归归类.就发现类不多.很多是重复的.知道那些可以保留.那些可以替换.就等于学会了.

[ 本帖最后由梦里柳地于 2008-10-9 15:30 编辑 ]

扣儿发表于 2008-10-9 17:53

代码看着好晕耶、· 学不会[:dd42:]

梦里柳地 发表于 2008-10-9 20:05

[quote]原帖由扣儿于 2008-10-9 17:53 发表代码看着好晕耶、· 学不会[:dd42:] [/quote]

梦里柳地问好扣儿姐姐啦~~~~

梦里柳地 发表于 2008-10-9 20:09

百荷音画全屏欣赏

梦里柳地 发表于 2008-10-10 05:17

按钮

[ 本帖最后由梦里柳地于 2008-10-10 05:37 编辑 ]

梦里柳地 发表于 2008-10-10 14:54

红叶想地址
http://www1.kcn.ne.jp/~cattleya/present/a-present/momijisou/momijisou.html

梦里柳地 发表于 2008-10-10 14:59

HTML+TIME红叶想全代码

红叶想HTML+TIME全代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML xmlns:v = "urn:schemas-microsoft-com:vml" xmlns:t =
"urn:schemas-microsoft-com:time"><HEAD><TITLE>梦里柳地翻译H+T特效:红叶想</TITLE>                                                                                                                       <META http-equiv=Content-Type content="text/html; charset=gb2312">
<META http-equiv=Content-Style-Type content=text/css>
<META content="MSHTML 6.00.2800.1561" name=GENERATOR>
<META http-equiv=imagetoolbar content=no>
<STYLE>.time {
    BEHAVIOR: url(#default#time2)
}
t\:* {
    BEHAVIOR: url(#default#time2)
}
v\:* {
    BEHAVIOR: url(#default#VML)
}

</STYLE>
</HEAD><BODY bgColor=#000000>

<t:animateColor id="color1" targetElement="body1" attributeName="background-color" to="#003300" begin="1" dur="15" autoreverse="true" repeatcount="1" />
<t:animateColor id="color2" targetElement="body1" attributeName="background-color" to="#142104" begin="35" dur="15" autoreverse="true" repeatcount="1" />

<TABLE class=time id=table1
style="FONT-SIZE: 11pt; Z-INDEX: 5; right: 10px; WIDTH: 360px; POSITION: absolute; bottom: 10px; HEIGHT: 200px"
width=280   begin ="90">
<TBODY>
<TR>
    <TD align=middle width=360 height=200>
      <DIV><FONT color=#cccccc size=3><B>峠梩憐<BR><BR>曢傟傞廐丂怓傕傒偠梩偑丂岅傝偐偗
丂丂丂丂<BR>怱傕垽偵丂愼傔偰棳傟傫<BR><BR>Cattleya</B><BR><BR></font><FONT
color=#666666 size=1>慺嵽 : <A href="http://homepage2.nifty.com/sdk/"><FONT color=#666666
size=1>To偺嶌昳廤</A>條<BR>MIDI : <A href="http://www.tky.3web.ne.jp/~amadeus/index.html"><FONT color=#666666
size=1>懳帺揑儐乕僩僺傾</A>條<BR>by : <A href="http://www1.kcn.ne.jp/~cattleya/cattleya.html"><FONT color=#666666
size=1>Cattleya</A><BR></font></DIV></TD></TR></TBODY></TABLE>
<DIV></DIV></TD></TR></TBODY></TABLE></DIV></DIV></DIV></DIV>

</BODY></HTML>

梦里柳地 发表于 2008-10-10 19:12

梦里柳地:点绛唇(李清照词)

梦里柳地 发表于 2008-10-10 20:24

【梦里柳地HTML+TIME】:点绛唇(李清照词)

全屏欣赏

梦里柳地 发表于 2008-10-10 20:25

【梦里柳地HTML+TIME】:诱红叶

全屏欣赏

梦里柳地 发表于 2008-10-10 20:26

【梦里柳地HTML+TIME】:诱红叶/全代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML xmlns:v = "urn:schemas-microsoft-com:vml" xmlns:t =
"urn:schemas-microsoft-com:time"><HEAD><TITLE>梦里柳地:诱红叶</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<META http-equiv=Content-Style-Type content=text/css>
<META content="MSHTML 6.00.2800.1561" name=GENERATOR>
<META http-equiv=imagetoolbar content=no>
<STYLE>.time {
    BEHAVIOR: url(#default#time2)
}
t\:* {
    BEHAVIOR: url(#default#time2)
}
v\:* {
    BEHAVIOR: url(#default#VML)
}

</STYLE>
</HEAD>

</HEAD><?IMPORT namespace="t" implementation="#default#time2">
<BODY onContextmenu="return false">
<BODY id="body1" bgcolor=#000000>

<t:animateColor id="color1" targetElement="body1" attributeName="background-color" to="#660000" begin="5" dur="15" autoreverse="true" />
<t:animateColor id="color2" targetElement="body1" attributeName="background-color" to="#031F03" begin="40" dur="15" autoreverse="true" />
<t:animateColor id="color3" targetElement="body1" attributeName="background-color" to="#300612" begin="80" dur="15" autoreverse="true" />

<t:transitionFilter id="Stretch1" targetElement="table1" type="progid:DXImageTransform.Microsoft.Stretch()" mode="in" begin="165" dur="10" autoreverse="false" repeatcount="1" />
<TABLE class=time id=table1
style="FONT-SIZE: 11pt; Z-INDEX: 5; right: 10px; WIDTH: 350px; POSITION: absolute; bottom: 30px; HEIGHT: 200px"
width=350 background="" begin ="165">
<TBODY>
<TR>
<TD align=middle width=350 height=200>

<DIV>
<P align=center><A href="http://hexun.com/mengliliudi/default.html" target=_blank>
<FONT face=隶书 color=#a52a2a size=6><B>点这里进<BR><BR>梦里柳地和讯博客</B></FONT></A></P>

</DIV></TD></TR></TBODY></TABLE>

</DIV></TD></TR></TBODY></TABLE>

</BODY></HTML>

梦里柳地 发表于 2008-10-10 20:28

【梦里柳地HTML+TIME】:点绛唇(李清照词) /全代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML xmlns:v = "urn:schemas-microsoft-com:vml" xmlns:t =
"urn:schemas-microsoft-com:time"><HEAD><TITLE>梦里柳地:点绛唇(李清照词)</TITLE>                                                                                                                       <META http-equiv=Content-Type content="text/html; charset=gb2312">
<META http-equiv=Content-Style-Type content=text/css>
<META content="MSHTML 6.00.2800.1561" name=GENERATOR>
<META http-equiv=imagetoolbar content=no>
<STYLE>.time {
    BEHAVIOR: url(#default#time2)
}
t\:* {
    BEHAVIOR: url(#default#time2)
}
v\:* {
    BEHAVIOR: url(#default#VML)
}

</STYLE>
</HEAD><BODY bgColor=#000000>

<P align=center><A href="http://hexun.com/mengliliudi/default.html" target=_blank>
<FONT face=隶书 color=#a52a2a size=6><B>点这里进<BR><BR>梦里柳地和讯博客</B></FONT></A></P>

</DIV></TD></TR></TBODY></TABLE>
<DIV></DIV></TD></TR></TBODY></TABLE></DIV></DIV></DIV></DIV>

</BODY></HTML>

梦里柳地 发表于 2008-10-10 20:39

【梦里柳地HTML+TIME】: 题目

全屏欣赏

[ 本帖最后由梦里柳地于 2008-10-10 20:48 编辑 ]

芸芸娱乐家园

【老兵HTML+TIME特效】边疆处处赛江南/和代码解析