<html>
<head>
<title>DW2 Teach -- 使用Timeline链</title>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=big5">
<style TYPE="text/css">
<!--
-->
</style>
<script language="JavaScript">
<!--
function MM_timelinePlay(tmLnName, myID) { //v1.2
//Copyright 1997 Macromedia, Inc. All rights reserved.
var i,j,tmLn,props,keyFrm,sprite,numKeyFr,firstKeyFr,propNum,theObj,firstTime=false;
if (document.MM_Time == null) MM_initTimelines(); //if *very* 1st time
tmLn = document.MM_Time[tmLnName];
if (myID == null) { myID = ++tmLn.ID; firstTime=true;}//if new call, incr ID
if (myID == tmLn.ID) { //if Im newest
setTimeout('MM_timelinePlay("'+tmLnName+'",'+myID+')',tmLn.delay);
fNew = ++tmLn.curFrame;
for (i=0; i<tmLn.length; i++) {
sprite = tmLn[i];
if (sprite.charAt(0) == 's') {
if (sprite.obj) {
numKeyFr = sprite.keyFrames.length; firstKeyFr = sprite.keyFrames[0];
if (fNew >= firstKeyFr && fNew <= sprite.keyFrames[numKeyFr-1]) {//in range
keyFrm=1;
for (j=0; j<sprite.values.length; j++) {
props = sprite.values[j];
if (numKeyFr != props.length) {
if (props.prop2 == null) sprite.obj[props.prop] = props[fNew-firstKeyFr];
else sprite.obj[props.prop2][props.prop] = props[fNew-firstKeyFr];
} else {
while (keyFrm<numKeyFr && fNew>=sprite.keyFrames[keyFrm]) keyFrm++;
if (firstTime || fNew==sprite.keyFrames[keyFrm-1]) {
if (props.prop2 == null) sprite.obj[props.prop] = props[keyFrm-1];
else sprite.obj[props.prop2][props.prop] = props[keyFrm-1];
} } } } }
} else if (sprite.charAt(0)=='b' && fNew == sprite.frame) eval(sprite.value);
if (fNew > tmLn.lastFrame) tmLn.ID = 0;
} }
}
function MM_timelineGoto(tmLnName, fNew, numGotos) { //v2.0
//Copyright 1997 Macromedia, Inc. All rights reserved.
var i,j,tmLn,props,keyFrm,sprite,numKeyFr,firstKeyFr,lastKeyFr,propNum,theObj;
if (document.MM_Time == null) MM_initTimelines(); //if *very* 1st time
tmLn = document.MM_Time[tmLnName];
if (numGotos != null)
if (tmLn.gotoCount == null) tmLn.gotoCount = 1;
else if (tmLn.gotoCount++ >= numGotos) {tmLn.gotoCount=0; return}
jmpFwd = (fNew > tmLn.curFrame);
for (i = 0; i < tmLn.length; i++) {
sprite = (jmpFwd)? tmLn[i] : tmLn[(tmLn.length-1)-i]; //count bkwds if jumping back
if (sprite.charAt(0) == "s") {
numKeyFr = sprite.keyFrames.length;
firstKeyFr = sprite.keyFrames[0];
lastKeyFr = sprite.keyFrames[numKeyFr - 1];
if ((jmpFwd && fNew<firstKeyFr) || (!jmpFwd && lastKeyFr<fNew)) continue; //skip if untouchd
for (keyFrm=1; keyFrm<numKeyFr && fNew>=sprite.keyFrames[keyFrm]; keyFrm++);
for (j=0; j<sprite.values.length; j++) {
props = sprite.values[j];
if (numKeyFr == props.length) propNum = keyFrm-1 //keyframes only
else propNum = Math.min(Math.max(0,fNew-firstKeyFr),props.length-1); //or keep in legal range
if (sprite.obj != null) {
if (props.prop2 == null) sprite.obj[props.prop] = props[propNum];
else sprite.obj[props.prop2][props.prop] = props[propNum];
} }
} else if (sprite.charAt(0)=='b' && fNew == sprite.frame) eval(sprite.value);
}
tmLn.curFrame = fNew;
if (tmLn.ID == 0) eval('MM_timelinePlay(tmLnName)');
}
function MM_initTimelines() {
//MM_initTimelines() Copyright 1997 Macromedia, Inc. All rights reserved.
var ns = navigator.appName == "Netscape";
document.MM_Time = new Array(1);
document.MM_Time[0] = new Array(2);
document.MM_Time["Timeline1"] = document.MM_Time[0];
document.MM_Time[0].MM_Name = "Timeline1";
document.MM_Time[0].fps = 5;
document.MM_Time[0][0] = new String("sprite");
document.MM_Time[0][0].slot = 1;
if (ns)
document.MM_Time[0][0].obj = document["Layer1"];
else
document.MM_Time[0][0].obj = document.all ? document.all["Layer1"] : null;
document.MM_Time[0][0].keyFrames = new Array(1, 15);
document.MM_Time[0][0].values = new Array(2);
document.MM_Time[0][0].values[0] = new Array(11,35,59,83,106,130,154,178,202,226,250,273,297,321,345);
document.MM_Time[0][0].values[0].prop = "left";
document.MM_Time[0][0].values[1] = new Array(759,759,759,759,759,759,759,759,759,759,759,759,759,759,759);
document.MM_Time[0][0].values[1].prop = "top";
if (!ns) {
document.MM_Time[0][0].values[0].prop2 = "style";
document.MM_Time[0][0].values[1].prop2 = "style";
}
document.MM_Time[0][1] = new String("behavior");
document.MM_Time[0][1].frame = 16;
document.MM_Time[0][1].value = "MM_timelineGoto('Timeline1','1')";
document.MM_Time[0].lastFrame = 16;
for (i=0; i<document.MM_Time.length; i++) {
document.MM_Time[i].ID = null;
document.MM_Time[i].curFrame = 0;
document.MM_Time[i].delay = 1000/document.MM_Time[i].fps;
}
}
//-->
</script>
<link rel="stylesheet" href="../dw2.css">
</head>
<body bgcolor="#0F3C5B" ONLOAD="MM_timelinePlay('Timeline1')" text="#FFFFFF">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>使用Timeline链</td>
</tr>
</table>
<div align="center"><center>
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr width="100%">
<td bgcolor="#0F3C5B"><span CLASS="p9"> 单击WINDOW-->Timelines,或直接按F9启动Timeline链,如果您以前接触过Macromedia的软体,如DIRECT或FLASH3,您就会发现Timeline与前二者的界面是几乎完全一致的。</span><p> </p>
<blockquote>
<blockquote>
<p><span CLASS="p9">表示您目前编辑的时间链</span></p>
<p><span CLASS="p9">表示返回最前面的一页框</span></p>
<p><span CLASS="p9">表示返回至前面的一页框</span></p>
<p><span CLASS="p9">表示返回至后面的一页框</span></p>
<p><span CLASS="p9"><span class="boo">AUTOPLAY</span>表示当前页面在浏览器中打开后是否自动执行这个时间链,AUTOPLAY附加一个Behaviors到页面头部的BODY中</span></p>
<p class="bobchao">(阿强注:而<span class="boo">Fps</span>是"每秒播放的画格数"的意思)</p>
<p><span CLASS="p9"><span class="boo">LOOP</span> 循环执行。</span></p>
</blockquote>
</blockquote>
<p><span CLASS="p9"><br>
圆圈代表关键页框,表示发生在物件上的时间。LAYER1是层名,1-15表示中有15页框,红色的小块表示当前操作的页框。<br>
<br>
让我们来实现一个简单的Timeline例子,我们让一段文字,从屏幕左边滚动至屏幕右边,就像您下面看到的一样 <br>
</span></p>
<p><span CLASS="p9"><br>
OK!首先我们用在前面讲述过的层来新建一个层,单击物件面板,选择层工具,画一个层,然后在该上面输入文字,改变文本颜色,好的,层已经做好了,下面轮到Timeline了。弹出Timelines,拖动层至Timeline中,您会看到如下图的情况,放开MOUSE,然后用鼠标选择最后一个关键页框,将层拖放至屏幕右边,选中AUTOPLAY和LOOP</span></p>
<p> </p>
<p><span CLASS="p9">存档,在浏览器预览一下,成功了,我们的第一个动态HTML应用例子完成了!</span></td>
</tr>
</table>
</center></div>
</body>
</html>