<!DOCTYPE HTML > < HTML > < ヘッド> < メタ文字コード= "UTF-8" > < リンクのrel = "スタイルシート" のhref = "CSS / new_file.css" /> < スクリプトタイプ= "テキスト/ javascriptの" SRC = "JS /new_file.js」 > </ スクリプト> < タイトル> </ タイトル> </ ヘッド> < 身体> < div要素のid = "mapDiv"= "位置:絶対;トップ:100pxに、左:200pxの、幅800ピクセル、高さ:600PX;ボーダー:1ピクセル赤色固体;テキスト整列:センター;" > < 入力タイプ= "ボタン" 値= "開始" ID = "ST" /> < DIV ID = "T" のスタイルを= '幅:は50px; 背景:URL(IMG / t1.png);高さ:48px;位置:相対;左:0PX、背景サイズ:は50px自動;上部:100pxに、」> </ divの> < DIV ID = "R" スタイル= '幅:は50px; 背景:URL(IMG / t1.png);高さ:48px;位置:相対;左:0PX、背景サイズ:は50px自動;上部:200pxの;」> </ DIV > </ DIV > </ ボディ> < スクリプトタイプ= "テキスト/ javascriptの" > VARの配列= [ " IMG / t1.png " 、" IMG / t3.png " 、" IMG / t6.png " ]。 VaRのintervalInstance = - 1 ; I = 0 ; 関数の開始() { TOBJ = のdocument.getElementById(" T " )。 rObj =document.getElementById(" R " )。 intervalInstance = たsetInterval(移動、100 )。 } 関数移動() { TL = のparseInt(tObj.style.left.split(" PX " )[ 0 ])。 RL = のparseInt(rObj.style.left.split(" PX " )[ 0 ])。 もし(RL <= 725 )は、I = (I + 1 )%3 他 { てclearInterval(intervalInstance)。 返します。 } tObj.style.left = (TL + 10 )+ " PX " 。 tObj.style.backgroundImage = " URL(" + 配列[ 0 ] [I] + " )" 。 rObj.style.left = (RL + 25 )+ " PX " 。 rObj.style.backgroundImage = " URL(" + 配列[ 0 ] [I] + " )"; } window.onload = 関数() { のdocument.getElementById(" ST " ).onclick = 始めます。 } </ スクリプト> </ HTML >