2016-05-17 16 views
1

私は働くカウントダウンタイマー「日、時間、分、秒」を持っていて、秒の「var」の色を白から黄色に変更する必要があります。白色を維持します。CSSクラスまたはスパンを.js変数に追加する

問題は、カウントダウンの日付全体が1つのdivに配置されていて、特定のクラスまたはスパンを「秒」変数に追加できないということです。

私はいろいろなソリューションを試しましたが、この場合は動作しないようですので、私は助けを求めて質問をすることにしました。

HTML。

<div class="container"> 
    <div id="countdown" align="center"> <!-- The countdown is being displayed here --> 

    </div> 
</div> 

JS。あなたが自分で見ることができ、ここで

CountDownTimer('06/01/2016 06:00 AM', 'countdown'); 

    function CountDownTimer(dt, id) 
    { 
     var end = new Date(dt); 

     var _second = 1000; 
     var _minute = + _second * 60; 
     var _hour = _minute * 60; 
     var _day = _hour * 24; 
     var timer; 




     function showRemaining() { 
      var now = new Date(); 
      var distance = end - now; 
      if (distance < 0) { 

       clearInterval(timer); 
       document.getElementById(id).innerHTML = 'end'; 

       return; 
      } 
      var days = Math.floor(distance/_day); 
      var hours = Math.floor((distance % _day)/_hour); 
      var minutes = Math.floor((distance % _hour)/_minute); 
      var seconds = Math.floor((distance % _minute)/_second); 




      document.getElementById('countdown').innerHTML = days + ' '; 
      document.getElementById('countdown').innerHTML += hours + ' '; 
      document.getElementById('countdown').innerHTML += minutes + ' '; 
      document.getElementById('countdown').innerHTML += seconds + ' '; 


     } 

     timer = setInterval(showRemaining, 1000); 
    } 

ワーキングJS FIDDLE:

https://jsfiddle.net/baqc6nx2/1/

そして、ここでの画像は、秒varが黄色に着色されなければならないと他の人が白の方法を説明しています。

How it should look. The second var displayed with yellow color.

私の悪い英語のため申し訳ありません

、そしてあなたの時間をありがとうございました。

EDIT:-------------------------------------------- -------------------

これは重複ではありませんが、私は最後の子セレクタを知っていますが、この場合は動作しませんでした。

編集--------------------------------------------- --------------------

TGO私を助けて今働いていますので、私はそれを完了できるように質問を再度開いてください。

+0

"私は特定のクラスまたはスパンを"秒 "変数に追加できません。何故ですか? – TGO

+0

それは私にエラーを与えている、私はそれを試してみるときに互換性がない、私はおそらく間違っている、それはすることができます。 – Nosferatu

+1

これを確認してください:https://jsfiddle.net/baqc6nx2/2/ – TGO

答えて

2

ここにあなたの問題を解決する更新されたフィドルです。便宜上、これはコードの変更行であるhttp://jsfiddle.net/baqc6nx2/2

document.getElementById('countdown').innerHTML += '<span style="color:yellow;">' + seconds + '</span> '; 

ここで私はspanタグを作成し、それを黄色をオンにする適切なCSSスタイルを与え、秒の値が内部で置かれていますスパン要素。

関連する問題