hiroeleganceのエレガンスとは呼べない日常

WEB屋(コーダー)hiroelegance(ヒロエレガンス)のブログhiroeleganceのエレガンスとは呼べない日常略して「エレ日」です。YouTubeでゲーム実況してます。毎週火曜0時にラジオも配信しています。

【JS】カウントダウンタイマー

   


お仕事であるイベントまでのカウントダウンをJSで組み込んだので覚書です。

元のスクリプトのままだと日時が英語表記なのですが、
jquery.yycountdown.min.jsの11行目を以下のように書き換えると日本語表記になります。

unit          : {d: '日', h: '時間', m: '分', s: '秒'},

jquery.yycountdown.min.jsは圧縮されていて一行ですがDreamWeaberで編集>コード>ソースフォーマットの適用で改行されたコードに戻ります。

html

TOKYO2020
TOKYO Olympics is on Friday, 24 July 2020 !!

CSS

.yycountdown-box{
  text-align:center;
  margin:10px 0;
  color:#000000;
}
 
#timerOlympic .yycountdown-box .yyc-day{
  font-size:3.0em;
  color:#009f3d;
}
#timerOlympic .yycountdown-box .yyc-hou{
  font-size:3.0em;
  color:#009f3d;
}
#timerOlympic .yycountdown-box .yyc-min{
  font-size:3.0em;
  color:#009f3d;
}
#timerOlympic .yycountdown-box .yyc-sec{
  font-size:3.0em;
  color:#009f3d;
}
 
#timerOlympic .yycountdown-box .yyc-day-text,
#timerOlympic .yycountdown-box .yyc-hou-text,
#timerOlympic .yycountdown-box .yyc-min-text,
#timerOlympic .yycountdown-box .yyc-sec-text{
  font-size:1.0em;
}

JavaScript



【参考サイト】
jQueryカウントダウンタイマー【デザイン自由自在版】
https://yyengine.jp/jquery-yycountdown/

 - JavaScript, お仕事