＜その１＞
- 背景用を１枚残し背景を塗り潰す
| 背景用(GIF:52k) | １枚目(GIF:10k) | ２枚目(GIF:10k) | ３枚目(GIF:10k) |
|---|
 |
 |
 |
 |
- 背景はＪＰＧ化し、塗り潰したものを透明ＧＩＦ化処理
| 背景用ＪＰＧ(１３k) | １枚目(GIF:11k) | ２枚目(GIF:11k) | ３枚目(GIF:11k) |
|---|
 |
|
|
|
- 背景はテーブルのバックグラウンドに、残りはＧＩＦ動画に加工し、重ねて表示
| 背景用ＪＰＧ(１３k) | ＧＩＦ動画部分(20k) | htmlソース | ＧＩＦ動画(13+20k) |
|---|
taki.jpg |
taki.gif |
<table>
<tr>
<td background="taki.jpg">
<img src="taki.gif">
</td>
</tr>
</table>
|
|
＜その２＞
- ＪＰＧの写真をＪａｖａＳｃｒｉｐｔで差換えて表示する
動く部分だけ切り抜いて１枚の写真に貼り付け、ＪＰＧで保存
| ＪＰＧ(１３k) | ＪＰＧ(１３k) | ＪＰＧ(１３k) | JavaScript(13*3k) |
|---|
taki1.jpg |
taki2.jpg |
taki3.jpg |
move() |
ＪａｖａＳｃｒｉｐｔのソース
|
|---|
<![CDATA[
<img src="taki1.jpg" name="taki">
<script language="javascript">
<!--
mv=new Array();
mv[1]=new Image();mv[1].src="taki1.jpg";
mv[2]=new Image();mv[2].src="taki2.jpg";
mv[3]=new Image();mv[3].src="taki3.jpg";
p=0;
function move(){
p++;if(p>3){p=1;}
document.images["taki"].src=mv[p].src;
tm=setTimeout("move()",100);
}
move();
//-->
</script>
]]>
|
|
|---|
|
