M07 あっちむいてほい^^

好きなボタンを押して勝負してください。「あっちむいて...」ボタンでムービングあっちむいてほいっとなります。<なんじゃそりゃ^^;;


応用:あんまり使い道ないかな....^^;;。

Sample





Source
ソース
(コピーしてお使いください)

<html>
<head>
<title></title>

<script language="JavaScript">
<!--
//エラーダイアログを出ないようにするNN3.0~
window.onerror = null ;

var hutunokao  = 10   ;//ふつうの顔の数
var hikao      = 4    ;//ほいの顔の数
var bton       = 4    ;//赤いボタンの数
var btof       = 4    ;//黒いボタンの数
var muki       = 10   ;//判定用 顔の向き(下0,左1,右3,上2)
var DlyHoi     = 1    ;//顔面の動くスピード(1/1000秒単位)
var kaoNo      = 0    ;//顔番号
var rnd        = 0    ;//ランダム
var hoiTimer   = 0    ;//タイマー
var hoiflg     = 1    ;//判定可なら0

//顔の向き表示
var kaonomuki    = new Array() ;
    kaonomuki[0] = '下↓' ;
    kaonomuki[1] = '左←' ;
    kaonomuki[2] = '上↑' ;
    kaonomuki[3] = '右→' ;

//イメージの事前読み込みだよん
if(document.images)
{
  takuimg = new Array();
  for(i=0;i<hutunokao;i++)
    {                                //ふつうの顔読み込み
      takuimg[i] = new Image()         ;
      takuimg[i].src = "WHAT"+i+".GIF" ;
    }

  Hoiimg = new Array();
  for(j=0;j<hikao;j++)
    {                               //ほいの顔読み込み
      Hoiimg[j] = new Image()          ;
      Hoiimg[j].src = "HOI"+j+".GIF"   ;
    }

  BTONimg = new Array()
  for(k=0;k<bton;k++)
    {                              //赤いボタン読み込み
      BTONimg[k] = new Image()         ;
      BTONimg[k].src = "BTON"+k+".GIF" ;
    }

  BTOFimg = new Array()
  for(l=0;l<btof;l++)
    {                              //黒いボタン読み込み
      BTOFimg[l] = new Image()         ;
      BTOFimg[l].src = "BTOF"+l+".GIF" ;
    }
}

//ボタン画像のon/off処理
function Ueon()     { if(!hoiflg)document.images['Ue'].src    = BTONimg[0].src }
function Ueoff()    { if(!hoiflg)document.images['Ue'].src    = BTOFimg[0].src }

function Hidarion() { if(!hoiflg)document.images['Hidari'].src= BTONimg[1].src }
function Hidarioff(){ if(!hoiflg)document.images['Hidari'].src= BTOFimg[1].src }

function Migion()   { if(!hoiflg)document.images['Migi'].src  = BTONimg[2].src }
function Migioff()  { if(!hoiflg)document.images['Migi'].src  = BTOFimg[2].src }

function Sitaon()   { if(!hoiflg)document.images['Sita'].src  = BTONimg[3].src }
function Sitaoff()  { if(!hoiflg)document.images['Sita'].src  = BTOFimg[3].src }

//ランダムだっ
function rndInt1(){
    rnd = parseInt( Math.random() * 10 ) ;
    return rnd ;
}

function HoiNomk(){
  rndInt1();
  //出目も多少調整できるのです^^;;
  if(rnd==0){HoiNo=0};
  if(rnd==1){HoiNo=1};
  if(rnd==2){HoiNo=2};
  if(rnd==3){HoiNo=3};
  if(rnd==4){HoiNo=0};
  if(rnd==5){HoiNo=1};
  if(rnd==6){HoiNo=2};
  if(rnd==7){HoiNo=3};
  if(rnd==8){HoiNo=2};
  if(rnd==9){HoiNo=3};
  return HoiNo;
}

//アニメーション本体
function HoiAmina() {
  if(document.images)
    {
      document.images['imgHoi0'].src = takuimg[kaoNo].src;
      kaoNo++
      if(kaoNo >= 10)
        {
            kaoNo = 0 ;
        }
      hoiTimer=setTimeout('HoiAmina()',DlyHoi);
   }
}

//スタート
function HoiStar(){
  hoiflg=0;
  Ueoff();Hidarioff();Migioff();Sitaoff()
  var kaoNo = 0;
  HoiAmina()
}

function kaomuki(muki,HoiNo){
  mukiKanji    = kaonomuki[muki];
  HoiNoKanji   = kaonomuki[HoiNo];
  return ;
}

//判定
function HoiBunki(){
  if(!hoiflg)
    {
      hoiflg=1;
      HoiNomk();
      if(document.images)
        {
          document.images['imgHoi0'].src = Hoiimg[HoiNo].src;
        }
      clearTimeout(hoiTimer);
      kaomuki(muki,HoiNo);
      if(muki==(HoiNo))
        {
          alert('おめでとうっ\nYou are WINNER !! (^^)/');
        }
        else
        {
          alert('わたしは『 '   + HoiNoKanji  + ' 』'
              + ' vs あなたは『 ' + mukiKanji + ' 』'
              + '\n\n残念でした(^^)')
        }
    }
  return;
}


//-->
</script>
</head>

<body bgcolor="#dddddd" text="#000000">

<form>
<input  type="button"
        value="あっちむいて..."
        onClick="if(document.images)HoiStar()">
<p>
<img
       border=0
       align="left"
       name="imgHoi0"
       src="HOI3.GIF" width="64" >

<!--上ボタン-->
<a
      href="javascript:muki=2;
      if(document.images)HoiBunki()"
      onMouseOver="if(document.images)Ueon()"
      onMouseOut="if(document.images)Ueoff()">
<img
      border=0
      name="Ue"
      src="BTOF0.GIF"
      width="64" height="21"></a><br>

<!--左右ボタン-->
<a
     href="javascript:muki=1;
     if(document.images)HoiBunki()"
     onMouseOver="if(document.images)Hidarion()"
     onMouseOut="if(document.images)Hidarioff()"><img

     border=0
     name="Hidari"
     src="BTOF1.GIF"
     width="32" heigth="22"></a><a

     href="javascript:muki=3;
     if(document.images)HoiBunki()"
     onMouseOver="if(document.images)Migion()"
     onMouseOut="if(document.images)Migioff()"><img

     border=0
     name="Migi"
     src="BTOF2.GIF"
     width="32" heigth="22"></a><br>
<!--下ボタン-->
<a
     href="javascript:muki=0;
     if(document.images)HoiBunki()"
     onMouseOver="if(document.images)Sitaon()"
     onMouseOut="if(document.images)Sitaoff()">
<img
     border=0
     name="Sita"
     src="BTOF3.GIF"
     width="64" height="21"></a>
<br clear=all>

</body>
</html>

使用している画像:
BTOF0.GIF BTOF1.GIF BTOF2.GIF BTOF3.GIF
BTON0.GIF BTON1.GIF BTON2.GIF BTON3.GIF
HOI0.GIF HOI1.GIF HOI2.GIF HOI3.GIF
WHAT0.GIF WHAT1.GIF WHAT2.GIF WHAT3.GIF WHAT4.GIF
WHAT5.GIF WHAT6.GIF WHAT7.GIF WHAT8.GIF WHAT9.GIF


Contents
| CONTENTS
| PART1 これだけ知っていれば大丈夫
| PART2 サンプルの紹介
| PART3 JavaScript言語仕様
| PART4 JavaScriptクイック書式一覧
| PART5 JavaScriptサイト
| オンラインサポートページ(回線をつないでください)


Maintained by
tato@fureai.or.jp works1997 Toshirou Takahashi