順番に

可能性の重複をWebページ光のタイルをしよう：私は現在、4×4のグリッド内のページ上の特定のタイルを点灯しようとしています
Making tiles on a web page light up different colours in a sequence 順番に

。

私はページにグリッドがありますが、点灯するように指定されたタイルはありません。誰かがこれを達成するために私を助けることができますか？

HTMLコード：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<LINK REL=StyleSheet HREF="style.css" TYPE="text/css" MEDIA=screen> 
<SCRIPT LANGUAGE="JavaScript" SRC="script.js"> 
</SCRIPT> 
</head> 
<body> 

<div class="container"> 
    <div class="box spacing"></div> 
    <div class="box spacing"></div> 
    <div class="box spacing"></div> 
    <div id="square1id" class="box"></div> 

    <div class="box spacing"></div> 
    <div class="box spacing"></div> 
    <div id="square2id" class="box spacing"></div> 
    <div class="box"></div> 

    <div class="box spacing"></div> 
    <div class="box spacing"></div> 
    <div class="box spacing"></div> 
    <div class="box"></div> 

    <div class="box spacing"></div> 
    <div class="box spacing"></div> 
    <div class="box spacing"></div> 
    <div class="box"></div> 
</div> 

</body> 
</html>

CSS：

body{ 
    background-color:#000000; 
    margin:0; 
    padding:0; 
} 

h1{ 
    color:#ffffff; 
    text-align:center; 
} 

.container{ 
    overflow:hidden; 
    width:860px; 
    margin-left:250px; 
    margin-top:20px; 
} 
.box{ 
    width:210px; 
    height:120px; 
    float:left; 
    background-color:#4D4D4D; 
    margin-bottom:3px; 
} 

.spacing{ 
    margin-right:3px; 
}

JavaScriptを：あなたは、各idのための1色のみを定義した

$(document).ready(function(){ 

    var colourinfo = { 
     square1id: [ 
        '#000000' 
        ], 

     square2id: [ 
        '#ffffff' 
        ], 

    }; 

    var count = 0; 

    var changecol = function(){ 
     $.each(colourinfo, function(tileid, colarray){ 
      $('#'+tileid).css('background-color', colarray[count%colarray.length]); 
     }); 
     count++; 
    }; 

    setInterval(changecol, 1000); 
});

おかげ

出典

2011-06-08 Tim

あなたはchangecol関数の最初の呼び出しを行いませんでした。実行されないので、setIntervalは決して実行されません。 –

新しい質問を作成するのではなく、既存の質問を編集する（http://stackoverflow.com/questions/6278518/making-tiles-on-a-web-page-light-up-different-colours-in-a-sequence）。 – Chowlett

これは..私はそれをjsfiddleに貼り付けましたhttp://jsfiddle.net/twFrB/ – jimplode

、これは完全に無意味です。毎秒メソッドを呼び出して、何もしませんが、background-colorをすでに持っている色に設定します。最初の呼び出しだけが実際に何かを実行します。異なる色の間を行き来することになっている場合は、カラー配列でさらに値を必要とします。

出典

2011-06-08 16:54:01

各配列内にさらに値を追加しましたが、これでも色の変更は表示されません。ありがとう – Tim

javascriptは、あなたの以前の質問から正確にコピーされています。これは実際のサンプルが添付されていて、誰かがjsfiddleに貼り付けた正確なコードを投稿しました（無意味でしたが）。他にも問題があると思います。 –

答えて

関連する問題