いい?かんじ時計

 

 

 

©2009 Nigoro. All rights reserved.

Macユーザーさん、Linuxユーザーさんにはうまく表示されてるかわかり兼ねます。
Linuxのフォントファミリーを追加してないのでごめんなさい。また、調べておきます。
多少のカスタマイズが出来るように、変更しました。
ソースの色付きの部分を変更するとかぎ括弧以外の括弧などにできます。
（年月日時分秒の上のdecorの所です。）
もちろん、皆さんがされているように漢数字などの部分を全角1文字で置き換えると、
ある程度カスタマイズできます。

まえまえ記事からの
Dateオブジェクトに関する記事
から引っぱりつづきで

カスタムペインに貼り付けられる、
ジャバスクリプトの
漢数字の時計を作ってみました。

おそらくペインの幅が180ピクセル位の
狭いテンプレのブログでも
貼る事ができると思います。

よろしければ、貼ってみてください。

以下にソースを示しますので、
そのままコピー＆ペーストで
貼れると思います。


ところで、javascript内で注釈を入れたいときは、
『//』以降その行のみコメントアウトできます。
『/*』『*/』ではさむとその間をコメントアウトできます。

CSSスタイルシートでは、
『/*』『*/』でコメントアウトできます。

HTML内では、
『<!--』『-->』でコメントアウトできます。

混乱しますよね


皆様のお陰で、ブログ名のようなペースではありますし、
記事の少なさにもかかわらず、
千nice！を達成することが出来ました。
皆さんのような才能がございませんので、
絵的な何かなどをプレゼント！
のようなこともできませんが、
コメントおよびnice！ありがとうございました。
これからもどうぞよろしくおねがいしま～すm(_ _)m


ソース

<style type="text/css"><!--
div.kanjikan1{text-align:center; padding:10px 0 0;}
div.kanjikan2{display:-moz-inline-box; display:inline-block; /display:inline; /zoom:1;}
#kanjikan3,#kanjikan4,#kanjikan5{letter-spacing:-1px; height:19px; font-size:14px; font-weight:bold; font-family:'ＭＳ 明朝','平成明朝','ＭＳ ゴシック','Osaka－等幅','Osaka-Mono',monospace;}
div.nigorocrkanclock{text-align:center; padding:8px 0 0; font-size:8px; font-family:'ＭＳ Ｐゴシック',Osaka;}
-->
</style><script type="text/javascript"><!--
/* Chinese characters' number clock by Nigoro. Ver1.04 */
var yorebe = ["日","月","火","水","木","金","土","曜日"],
kannumber = ["零","壹","貳","參","肆","伍","陸","漆","捌","玖"],
yearplace = [0,0,0,0,0,0,0,"","拾","萬","阡","陌","拾",""],
ymdhms = new Array(10),decor = ["「","」"],
yeartosecondunit = ["年","月","日","時","分","秒"];

function kanclock(){
 var gcan, i, tmp1, tmp2, tmp3, tmp4;
 gcan = new Date();
 ymdhms[0] = gcan.getFullYear();
 ymdhms[1] = gcan.getMonth() + 1;
 ymdhms[2] = gcan.getDate();
 ymdhms[3] = gcan.getHours();
 ymdhms[4] = gcan.getMinutes();
 ymdhms[5] = gcan.getSeconds();
 ymdhms[6] = gcan.getDay();

 tmp1 = "";
 for(i=6 ;i>0 ;i--){
  yearplace[i] = ymdhms[0]%10;
  ymdhms[0] = Math.floor(ymdhms[0]/10);
  if(yearplace[i] != 0){
   if(i < 6 && yearplace[i] == 1)
    tmp1 = yearplace[i+7] + tmp1;
   else
    tmp1 = kannumber[yearplace[i]] + yearplace[i+7] + tmp1;
  }
 }
 ymdhms[7] = tmp1 + yeartosecondunit[0];
/* Copyright(C) 2009 にごろ Nigoro. All rights reserved. */
 ymdhms[8] = "";
 ymdhms[9] = "";
 for(i=1 ;i<=5 ;i++){
  tmp1 = "";
  tmp2 = Math.floor(ymdhms[i]/10);
  if(tmp2 != 0){
   if(tmp2 == 1)
    tmp1 += yearplace[12];
   else
    tmp1 += kannumber[tmp2] + yearplace[12];
  }
  else
   tmp1 += tmp1;

  tmp3 = ymdhms[i]%10;
  if(tmp3 != 0)
   tmp1 += kannumber[tmp3];
  else{
   if(i > 2 && tmp2 == 0)
    tmp1 += kannumber[tmp3];
   else
    tmp1 += "";
  }
  tmp4 = "　　" + tmp1 + "　";
  if(i < 3){
   if(i == 1) ymdhms[8] += tmp4.slice(tmp4.length-3, -1) + yeartosecondunit[i];
   else ymdhms[8] += tmp4.slice(tmp4.length-4,- 1) + yeartosecondunit[i];
  }
  else
   ymdhms[9] += tmp4.slice(tmp4.length-4, -1) + yeartosecondunit[i];
 }

 document.getElementById("kanjikan3").innerHTML = ymdhms[7];
 document.getElementById("kanjikan4").innerHTML =
  " " + ymdhms[8] + decor[0] + yorebe[ymdhms[6]] + yorebe[7] + decor[1];
 document.getElementById("kanjikan5").innerHTML = ymdhms[9];
}
//--></script><div class="kanjikan1">
<div class="kanjikan2"><div id="kanjikan3">&nbsp;</div>
<div id="kanjikan4">&nbsp;</div><div id="kanjikan5">&nbsp;</div></div>
<div class="nigorocrkanclock">&copy;2009 Nigoro. All rights reserved.</div>
</div><script type="text/javascript"><!--
setInterval("kanclock()",1000);
//--></script>

タグ：漢数字 時計 ブログ カスタムペイン