画儿

大图音画的图片拼合及动画拼合

 

 

编写：画儿

 

 

　　此教材于清净莲海独家发布，仅限浏览，谢绝转载。因初次编写音画代码教材，肯定会有很多不当之处，敬请朋友们指正。

 

　　我们简略认识一下HTML代码。HTML是一种用来制作超文本文档的简单标记语言，与普通文档不同，它可以加入文字、图片、声音、动画、影视等内容，可以从一个文件跳转到另一个文件，与世界各地主机的文件连接，通过WWW浏览器显示出效果。它的特点是用一对小尖括弧（“<  和  >"）作为标签。所谓标签，就是它采用了一系列的指令符号来控制输出的效果，这些指令符号用“<标签名字　属性>”来表示。而且大部份是成对的双标签，即首标签和尾标签。

 

　　一、音画图片的拼合

 

　　裁切图片的拼合（以四张图片为例）

　　代码格式如下：
<TABLE style="LEFT: -120px; WIDTH: 1000px; POSITION: relative; TOP: 0px" cellSpacing=0 cellPadding=0 width=1000 align=center border=0>
<TBODY>
<TR>
<TD><IMG height=图片高度 src="第一张图片网址" width=图片宽度></TD></TR>
<TR>
<TD><IMG height=图片高度 src="第二张图片网址" width=图片宽度></TD></TR>
<TR>
<TD><IMG height=图片高度 src="第三张图片网址" width=图片宽度></TD></TR>
<TR>
<TD><IMG height=图片高度 src="第四张图片网址" width=图片宽度></TD></TR></TBODY></TABLE>

<EMBED src=此处加音乐网址 hidden=true type=audio/mpeg loop="true" autostart="true"></EMBED>

画儿

二、FLASH音画的拼合

 

　　裁切图片的拼合和动画的拼合道理相同。只要将插入图片的标识符换成插入FLASH的标识符就可以了，下面，我们来看看相关代码：

 

　　动画SWF拼合代码如下:

 　　

　　大图音画边框语言

<TABLE style="LEFT: -120px; WIDTH: 1000px; POSITION: relative; TOP: 0px" cellSpacing=0 cellPadding=0 width=1000 align=center border=0>
<TBODY>
<TR>

　　大图音画图片展示语言

<TD><IMG height=图片高度 src="第一张图片网址" width=图片宽度></TD></TR>
<TR>

<TD><IMG height=图片高度 src="第二张图片网址" width=图片宽度></TD></TR>
<TR>

<TD><IMG height=图片高度 src="第三张图片网址" width=图片宽度></TD></TR>
（插入flash语言）<TR>

　　最后的休止符

</TBODY></TABLE>

<EMBED style="LEFT: 200px; WIDTH: 700px; POSITION: absolute; TOP: 175px; HEIGHT: 300px" align=right src=第一个flash地址 width=700 height=300 type=application/x-shockwave-flash wmode="transparent" quality="high">

<EMBED style="LEFT: 200px; WIDTH: 700px; POSITION: absolute; TOP: 175px; HEIGHT: 300px" align=right src=第二个flash地址 width=700 height=300 type=application/x-shockwave-flash wmode="transparent" quality="high">

　　音乐展示语言

<EMBED src=此处加音乐网址 hidden=true type=audio/mpeg loop="true" autostart="true"></EMBED>

画儿

　　在起始代码的部分，有这样一组代码：style="LEFT: -120px; WIDTH: 1000px; POSITION: relative; TOP: 0px",这点对大图音画贴的发贴是个关键，其属性是：
LEFT: -120px;定位网页整体的左右位置，数值越小越向左偏移，反之向右移动
WIDTH: 1000px 整体网页的展示宽度，用像素值来定义
POSITION: relative设定网页以相对本文档面显示
TOP: 0px 边框距顶部的距离

画儿

　　总结：如果您还弄不明白上面的原理，就将下面大图音画语言，直接套入相关素材就ok。

<TABLE style="LEFT: -120px; WIDTH: 1000px; POSITION: relative; TOP: 0px" cellSpacing=0 cellPadding=0 width=1000 align=center border=0>
<TBODY>
<TR>
<TD><IMG height=图片高度 src="第一张图片网址" width=图片宽度></TD></TR>
<TR>
<TD><IMG height=图片高度 src="第二张图片网址" width=图片宽度></TD></TR>
<TR>
<TD><IMG height=图片高度 src="第三张图片网址" width=图片宽度></TD></TR>
<EMBED style="LEFT: 200px; WIDTH: 700px; POSITION: absolute; TOP: 175px; HEIGHT: 300px" align=right src=第一个flash地址 width=700 height=300 type=application/x-shockwave-flash wmode="transparent" quality="high">
<EMBED style="LEFT: 200px; WIDTH: 700px; POSITION: absolute; TOP: 175px; HEIGHT: 300px" align=right src=第二个flash地址 width=700 height=300 type=application/x-shockwave-flash wmode="transparent" quality="high">
<TR>
</TBODY></TABLE>
<EMBED src=此处加音乐网址 hidden=true type=audio/mpeg loop="true" autostart="true"></EMBED>

画儿

图片素材

 

第一张图片http://blog.heshang.net/attachments/2009/04/18/4812_200904181308381.jpg    宽1000 高800

第二张图片http://blog.heshang.net/attachments/2009/04/18/4812_200904180852531.jpg   宽1000 高834

第三张图片http://blog.heshang.net/attachments/2009/04/18/4812_200904181312551.jpg  宽1000 高1270

 

 

flash素材

http://www.chuanxi.com.cn/images3/ypzx-2.swf

http://www.chuanxi.com.cn/images3/ypzx.swf

http://toumingfalsh.jimdo.com/swf/283460608.swf

http://www.xcwhw.cn/fla/jrxq/124.swf

http://toumingfalsh.jimdo.com/swf/283461108.swf

http://toumingfalsh.jimdo.com/swf/283456008.swf?2008-07-25

http://www.xcwhw.cn/fla/jrxq/95.swf

http://toumingfalsh.jimdo.com/swf/283460408.swf

http://www.xcwhw.cn/fla/jrxq/119.swf

http://toumingfalsh.jimdo.com/swf/346905308.swf

http://toumingfalsh.jimdo.com/swf/283460908.swf

 

 

音乐 （禅聚）http://st.mp3.zgfj.cn/2008-03/chanwu/20080315chanju.mp3

画儿