カーソルの動きに合わせて動く目／サンプル
ダウンロード
move_eye.lzhmove_eye.lzh
上記いずれかをダウンロードし解凍すると、以下のファイルが出来ます。
- index.html
- images/body.gif
- images/eyeball.gif
- images/blackeye.gif
- js/eye.js
・・・サンプルページ
・・・画像（体）
・・・画像（目）
・・・画像（目玉）
・・・スクリプト本体
・・・画像（体）
・・・画像（目）
・・・画像（目玉）
・・・スクリプト本体
設定
<head> と </head> の間に以下を書いてデータを設定して下さい。また <body> タグに onLoad="iniEyeMove();" を記入して下さい。
<script language="JavaScript" type="text/JavaScript">
<!--
/*******************************************************
* 画像を指定
*======================================================
* 画像ファイルは絶対/相対パスどちらでも可
* 左右の目の画像は別でも可、但しサイズは同じであること
*******************************************************/
var iBody = "images/body.gif"; // 体画像
var wBody = 75; // 体の幅
var hBody = 75; // 体の高さ
var iRBlackEye = "images/blackeye.gif"; // 右黒目画像
var iLBlackEye = "images/blackeye.gif"; // 左黒目画像
var wBlackEye = 7; // 黒目の幅
var hBlackEye = 7; // 黒目の高さ
var iREyeBall = "images/eyeball.gif"; // 右白目画像
var iLEyeBall = "images/eyeball.gif"; // 左白目画像
var wEyeBall = 29; // 白目の幅
var hEyeBall = 33; // 白目の高さ
/*******************************************************
* 位置フラグ
*======================================================
* 0:ブラウザ内側の中央
* 1:ブラウザ内側左上から数値指定
* 2:ブラウザ内側右下からの数値指定
*******************************************************/
var flgTop = 0; // 0:中央、1:上から、2:下から
var flgLeft = 0; // 0:中央、1:左から、2:右から
/*******************************************************
* 体の位置指定
*======================================================
* ブラウザの内側からの距離をピクセルで指定
* 位置フラグで 0 選択時はこの数値は無視されます
*******************************************************/
var tBody = 10; // 縦位置
var lBody = 10; // 横位置
/*******************************************************
* 目の位置指定
*======================================================
* 体の画像内の位置
*******************************************************/
var tREyeBall = 18; // 右白目の縦位置
var tLEyeBall = 18; // 左白目の縦位置
var lREyeBall = 8; // 右白目の横位置
var lLEyeBall = 38; // 左白目の横位置
</script>
<script language="JavaScript" src="./js/eye.js"></script>
スポンサード リンク
