⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 part5_2.cfm

📁 InterDev 6.0教程part1到part13
💻 CFM
📖 第 1 页 / 共 2 页
字号:
🔍
12 
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb_2312-80">
<META NAME="Generator" CONTENT="Microsoft Word 97">
<TITLE>过渡（Transition）</TITLE>
</HEAD>
<BODY>

<B><FONT FACE="楷体_GB2312" LANG="ZH-CN" SIZE=5><P ALIGN="JUSTIFY">过渡（Transition）</P>
</B></FONT><FONT SIZE=3><P ALIGN="JUSTIFY">    </FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>使用过渡，可以让你控制一幅图象以何种方式被另一幅图象所代替。如果用脚本来实现这一功能将是费时的。每幅图象都有一</FONT><FONT SIZE=3>filter</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>属性，这便利可以对图象使用过滤，从这一点来看，滤镜和过渡以同一咱方式作用于图象。然而你很快会看到过渡需要一些脚本代码。</P>
</FONT><FONT SIZE=3><P ALIGN="JUSTIFY">    1E4.0</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>提供两种类型的过渡，一种是</FONT><FONT SIZE=3>blend</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>过渡，它提供图象的渐入和渐出，另一种是</FONT><FONT SIZE=3>reveal</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>过渡，它包含</FONT><FONT SIZE=3>24</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>种不同的技术。</P>
<P ALIGN="JUSTIFY">先让我们来看一下</FONT><FONT SIZE=3>blend</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>过渡，如下面所示的源码。此例在网页上显示一幅图象和一个标有</FONT><FONT SIZE=3>Blend</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>的按钮，当点击此按钮时，图象在两秒钟内由</FONT><FONT SIZE=3>kids.gif</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>变为</FONT><FONT SIZE=3>art.gif</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>。</P>
<P ALIGN="JUSTIFY"></P>
</FONT><FONT SIZE=3><P ALIGN="JUSTIFY">&lt;script language="vbscript"&gt;</P>
<P ALIGN="JUSTIFY">sub b1_onclick</P>
<P ALIGN="JUSTIFY">  img1.filters(0).apply()</P>
<P ALIGN="JUSTIFY">  img1.src="art.gif"</P>
<P ALIGN="JUSTIFY">  img1.filters(0).play()</P>
<P ALIGN="JUSTIFY">end sub</P>
<P ALIGN="JUSTIFY">&lt;/script&gt;</P>
<P ALIGN="JUSTIFY"></P>
<P ALIGN="JUSTIFY">&lt;img id="img1" src="kids.gif" </P>
<P ALIGN="JUSTIFY">  style="filter: blendTrans(duration=2)"&gt;</P>
<P ALIGN="JUSTIFY">&lt;br&gt;</P>
<P ALIGN="JUSTIFY">&lt;input type="button" id="b1" value="Blend"&gt;</P>
</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3><P ALIGN="JUSTIFY"></P>
<P ALIGN="JUSTIFY">例中第三行调用</FONT><FONT SIZE=3>apply()</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>方法，它通知浏览器过渡即将开始，屏幕在</FONT><FONT SIZE=3>play()</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>方法调用前不要作任何变动。第四行将图象的</FONT><FONT SIZE=3>src</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>属性变为</FONT><FONT SIZE=3>art.gif</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>，第五行调用</FONT><FONT SIZE=3>play()</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>方法使得过渡开始。</P>
<P ALIGN="JUSTIFY">现在让我们来看</FONT><FONT SIZE=3>reveal</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>过渡，下表列出了所有的</FONT><FONT SIZE=3>reveal</FONT><FONT FACE="宋体" LANG="ZH-CN" SIZE=3>过渡及其所对应的代码，在后面你将看到如何使用这些代码。</P>
<P ALIGN="JUSTIFY"></P></FONT>
<P ALIGN="RIGHT"><TABLE BORDER CELLSPACING=1 CELLPADDING=7 WIDTH=553>
<TR><TD WIDTH="50%" VALIGN="TOP" BGCOLOR="#ffffff">
<B><FONT FACE="宋体" LANG="ZH-CN" SIZE=3><P ALIGN="JUSTIFY">过渡名</B></FONT></TD>
<TD WIDTH="50%" VALIGN="TOP" BGCOLOR="#ffffff">
<B><FONT FACE="宋体" LANG="ZH-CN" SIZE=3><P ALIGN="JUSTIFY">代码</B></FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Box In</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">0</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Box Out</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">1</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Checkboard Across</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">10</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Checkboard Down</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">11</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Circle In</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">2</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Circle Out</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">3</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Dissolve</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">12</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Horizontal Blinds</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">9</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Random</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">23</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Random Bars Horizontal</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">21</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Random Bars Vertical</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">22</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Split Horizontal In</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">15</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Split Horizontal Out</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">16</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Split Vertical In</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">13</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">Split Vertical Out</FONT></TD>
<TD WIDTH="50%" VALIGN="TOP">
<FONT SIZE=3><P ALIGN="JUSTIFY">14</FONT></TD>
</TR>
<TR><TD WIDTH="50%" VALIGN="TOP">
12

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -