多重イメージ用ライブラリ layeredimgs.js

※事前に onloadhook.js をロードしておく必要あり．

下図は，tB4_0050.gif, tB4_0048.gif, tB4_0044.gif, tB4_0040.gif, tB4_0036.gif, tB4_0032.gif, tB4_0028.gif, tB4_0024.gif, tB4_0020.gif, tB4_0016.gif, tB4_0012.gif, tB4_0008.gif, tB4_0004.gif, tB4_0001.gif の 14枚の（透過GIFの）イメージを重ねてある．記述方法は以下の通り:

<div class="LayeredImgs" id="tree" width="320" height="480"
     srcs="[ 'tB4_0050.gif', 'tB4_0048.gif', 'tB4_0044.gif', 'tB4_0040.gif',
             'tB4_0036.gif', 'tB4_0032.gif', 'tB4_0028.gif', 'tB4_0024.gif',
             'tB4_0020.gif', 'tB4_0016.gif', 'tB4_0012.gif', 'tB4_0008.gif',
             'tB4_0004.gif', 'tB4_0001.gif' ]"></div>

また，下図は，

<div class="LayeredImgs" id="tree2" layers="14" width="320" height="480"></div>

のように記述しておき，onload イベントで画像を読み込ませている:

<script type="text/javascript"><!--
OnloadHook.push(function (e) {
  loadLayeredImg("tree2", 13, "tB4_0001.gif");
  loadLayeredImg("tree2",  0, "tB4_0050.gif");
  loadLayeredImg("tree2",  1, "tB4_0048.gif");
  loadLayeredImg("tree2",  2, "tB4_0044.gif");
  loadLayeredImg("tree2",  3, "tB4_0040.gif");
  loadLayeredImg("tree2",  4, "tB4_0036.gif");
  loadLayeredImg("tree2",  5, "tB4_0032.gif");
  loadLayeredImg("tree2",  6, "tB4_0028.gif");
  loadLayeredImg("tree2",  7, "tB4_0024.gif");
  loadLayeredImg("tree2",  8, "tB4_0020.gif");
  loadLayeredImg("tree2",  9, "tB4_0016.gif");
  loadLayeredImg("tree2", 10, "tB4_0012.gif");
  loadLayeredImg("tree2", 11, "tB4_0008.gif");
  loadLayeredImg("tree2", 12, "tB4_0004.gif");
});
//--></script>