| BACK |
JavaScript

わたしのホムペがぁぁ〜

単純なスクリプトと動画を組み合わせて遊んでるだけの作品です (^^;
スクリプト自体の機能は、1つの画像をウィンドウ左から右へ進めるだけです。
上下位置はランダムに変わります。

ご利用の前に「利用規定」を必ず読んでおいてください。
スクリプトを利用した場合、無条件に同意したものとみなします。


更新履歴
2001.10.17
Ver.0.01公開

動作確認済ブラウザ

Internet Explorer 5.01 (Windows)
Netscape Communicator 4.7 (Windows)
Netscape 6.01 (Windows)


設置方法
  1. </HEAD>の直前行付近に以下のソースをコピーします。

<!-- == for わたしのホムペがぁぁ〜 == -->
<style type="text/css">
<!--
.mushikun {
  position: absolute;
  left: 0px;
  top: -50px;	/* 使う画像の高さより大きめの値をマイナス付きで指定 */
}
-->
</style>
<!-- ================================ -->

  1. </BODY>の直前行付近に以下のソースをコピーします。
  2. ソース内の赤字部分を、ソース内のコメントを参考に設定してください。
    画像ファイルは別途ご用意ください。(私の自作画像でもよければどうぞ)

<!-- ====================================================================================
                         わたしのホムペがぁぁ〜 Version 0.01
                        http://homepage3.nifty.com/masas/sdir/
                      Copyright(c)2001 Masa, All Rights Reserved.
===================================================================================== -->
<script type="text/javascript" language="JavaScript">
<!--
/*------------------*
 *  設定はここから  *
 *------------------*/
var IMGNAME   = 'mushi.gif';    // 動かす画像
var IMGWIDTH  = 300;            // 画像の横幅(ピクセル)
var IMGHEIGHT = 30;             // 画像の高さ(ピクセル)
var STEPPIX   = 2;              // 1回に進む量(ピクセル)
var MSSPEED   = 100;            // 進む処理の間隔(ミリ秒)
var NEXTLATE  = 1000;           // 次回開始までの間隔(ミリ秒)
/*------------------*
 *  設定はここまで  *
 *------------------*/
function setPosMushi(posX, posY)
{
  if (document.layers) {
    document.layers["mselm"].left = posX;
    document.layers["mselm"].top = posY;
  } else if (document.all) {
    document.all["mselm"].style.left = posX + "px";
    document.all["mselm"].style.top = posY + "px";
  } else if (document.getElementById) {
    document.getElementById("mselm").style.left = posX + "px";
    document.getElementById("mselm").style.top = posY + "px";
  }
}
function gogoMushikun()
{
  mushiX += STEPPIX;
  if (mushiX > docWidth) {
    setTimeout("startMushikun()", NEXTLATE);
  } else {
    setPosMushi(mushiX, mushiY);
    setTimeout("gogoMushikun()", MSSPEED);
  }
}
function startMushikun()
{
  if (document.all) {
    docHeight = document.body.clientHeight;
    docWidth = document.body.clientWidth;
  } else {
    docHeight = window.innerHeight;
    docWidth = window.innerWidth;
  }
  mushiX = 0 - IMGWIDTH;
  mushiY = Math.floor(Math.random() * (docHeight - IMGHEIGHT));
  setPosMushi(mushiX, mushiY);
  setTimeout("gogoMushikun()", MSSPEED);
}
var docWidth, docHeight, mushiX, mushiY;
if (document.layers || document.all || document.getElementById) {
  document.write('<div id="mselm" class="mushikun">');
  document.write('<img src="'+IMGNAME+'" width="'+IMGWIDTH+'" height="'+IMGHEIGHT+'">');
  document.write('<\/div>');
  setTimeout("startMushikun()", NEXTLATE);
}
// -->
</script>
<!-- ======================= End of わたしのホムペがぁぁ〜 ========================== -->




画像

ブッサイクな絵ですけど、もしよろしかったら使ってください (^^;
mushi.gif (W300xH30)

mushi.gif




Copyright © 2001-2002 Masa, All Rights Reserved.