- ベストアンサー
タイマーをデジタル時計風にするには
- カウントダウンタイマーをデジタル時計風にする方法を教えてください。
- デジタル数字のイメージを準備し、上のコードに組み込みたいです。
- 自作のデジタル時計は以下のようなものです。
- lucky520aki
- お礼率0% (0/16)
- JavaScript
- 回答数8
- ありがとう数0
- みんなの回答 （8）
- 専門家の回答
質問者が選んだベストアンサー
No1 と No3 のちがいは、No7 のこーどでいうと、 if (!n) n = d; があるかないかです。 new Date は、Date オブジェクトをかえしますが、 +new Datte とすると、(new Date).getTime () とおなじいみになります。 それを 1000 でわり、びょうにへんかんします。 じさの９じかんをちょうせいし、60*60*24 びょうであまりをもとめたのが n です。 これを setInterval で、でくりめんとしています n == 0、 つまりひづけがかわったとき」、 n == -1 になると、かんすう f は、ただしいひょうじをしなくなります。 No3 のこーどは、ひづけがかわったときに、n = 86400 になるため、ひづけがかわるたびに、１びょうづつおくれていきます。 じぶんでこーどをかいておいていうのもへんですが、これはさんこうにしないほうがうよいとおもいます。 iPhone なら、canvas もつかえることだし、そちらをつかうときれいかも？
その他の回答 (7)
- babu_baboo
- ベストアンサー率51% (268/525)
> ショートコーディング？ > 別名：「コードゴルフ」ですか？ｗｗ > なんか、そういう遊びがあると本で読んだことがあります。 あそびだって？ち・が・う・ね。ときとしてげいじゅつだね。^^; そして、ほんとうにすまない。またていせい。 あっしゅくするまえのしゅうせいしたやつ。 すくりぷとは、</body> のちょくぜんにおけば、onload をつかわなくてよいよ。 (function (gete, pad, setn) { var d = 86400; var e = ['a','b','c','d','e','f'].map (gete); var n = d - ((+ new Date / 1000) + 32400) % d |0; var f = function () { if (!n) n = d; (pad (--n/3600) + pad (n/60%60) + pad (n%60)).split('').forEach (setn, e); }; setInterval (f, 1000); })( function (s) { return document.getElementById (s); }, function (n) { return (n < 10 ? '0': '') + (n |0); }, function (s, i) { this[i].alt = 'dg' + s + '.gif'; } );
- 神崎 渉瑠（@taloo）
- ベストアンサー率44% (1016/2280)
>http://okwave.jp/qa/q7109072.html >「javascriptについて」の質問者からの補足に、 なるほど、クレクレ君でしたか。 そういうことでしたら失礼しました。 ※ネタニマジレスカコワルイ＞自分 >> 大学ではまだCとC#しかまだ学んでおらず、 >と、あります。 > >「まだ」という文字から、在学していて「課題」であると判断しました。 なるほど、、、 私の見方では、『CとC#しかまだ学んでおらず』ですからそれ以外の言語は学校以外、つまり自分のサイトで使うための物ではないかと。。。 こちらとしてはこんな書き方があるのかと、興味深い所ではあるんですが、 私としては、こういうコードでも（自分が書いた物なら）コピーされるのは嫌ですけどね。 （主観なので、他の回答者がそれでも良いというのなら、私はかまいません。） 学校の課題なら、ともすれば減点ですから。（先生が気づけば、ですけどね。） コードが古くさいと行っても、最初の勉強ってそんな物じゃないでしょうか？ サーバーの時間を取得と行っても、いきなりAjaxやサーバープログラム（少なくともJavaScript以外の言語か、第三者のAPIが絡む）から入るのは無理があると思います。 DOMはわからないけどWebSocketならわかる！という人は、じゃあ、 http://www2.nict.go.jp/w/w114/tsp/JST/JST5.html http://www2.nict.go.jp/w/w114/tsp/PubNtp/clients.html (WebSocketではなくJSONPです） このサービスで時刻を取得して、わかりもしないDOMで表示できるかというと、そういうわけでもないと思います。 JavaScriptの基本部分は古い物ですし、HelloWorldはほとんど変わらないと思います。
補足
一応、「課題」ではないです。 僕は基本、「できそうなこと」を自分でこなして、「できそうにないこと」⇐（一人で）はここで質問するんですよ。 ある意味「クレクレ君」です。 提示してもらった「サンプルコード」をペースに自分でいじって見たいと言うか、どれだけなんです。 コピペはしないですけど... ※「いじる」と言っても１、２割程度しか書き換えることができないので、もしかしたら熟練のプログラマさんたちには「コピペ」と見なされるのかも知れませんがｗｗｗ
- babu_baboo
- ベストアンサー率51% (268/525)
taloo さん、 No1&3です。いつも回答を楽しんで読んでおります。 > 回答者の利己的な考え これには、日頃から平仮名で回答しているので、反論のしようもありません。 http://okwave.jp/qa/q7109072.html 「javascriptについて」の質問者からの補足に、 > 大学ではまだCとC#しかまだ学んでおらず、 と、あります。 「まだ」という文字から、在学していて「課題」であると判断しました。 例題から逸脱した回答に難色しめしているようなので、その辺も考慮する対象となりました。 （なぜだか、コードが古く感じます。サーバーの時間取得もスルー。過去の経験から言うとまさに「課題」） http://closure-compiler.appspot.com/home これを使って圧縮しましたが、心ときめいたのは、先人の人達が書いた遊び心のショートコーディングです。質問者もときめいてくれれば良いのですが。
補足
そうですね。僕はまだ大学在学中なんですが、「課題」ではないですよ。 ただ、iPhoneの「デジタル時計」アプリを見て、「個人でもこういうの作れるのかな？」と思っただけです。 ショートコーディング？ 別名：「コードゴルフ」ですか？ｗｗ なんか、そういう遊びがあると本で読んだことがあります。
- 神崎 渉瑠（@taloo）
- ベストアンサー率44% (1016/2280)
以前の質問がどんなで、解答がどんなのかは知りませんが、 >ANo.1 >ANo.2 他人のコードをコピーペーストで使う事がすばらしいとは思えません。 コピーペーストで使えというのは質問・回答ではなく、ただの制作代行だと思うんですけどね。 それに、制作代行はクレクレ君を増やすだけだと思います。 （「こういうコードを書いてください」質問文に書くと書いてくれないが、書かなければ作ってもらえる。） また、回答を使われなければ非難するのは、回答者の利己的な考え、エゴだと思います。 他人が書いたコードほど読みづらい物はありません。 つまり、回答者にとって質問者のコードほど読みづらい物はないでしょうが、 同様に、質問者に取って回答者のコードほど読みづらい物はありません。 どちらが技術的に優れているかを考えれば、回答者が質問者に歩み寄るのが当然ではないでしょうか。 回答する気がないならかまわないと思いますけどね。 私も、課題の様な質問にトリッキーなコードで回答する事はありますが、学校で習ったであろう範囲を逸脱させ、もしコピーペーストで提出したら講師にバレる可能性を高くするためです。 それで理解できるなら、質問するまでもなく自力で解答できるでしょう。 ----------------------------- >document.getElementById('cd').innerHTML= "今日の終わりまであと" + hour + "時間" + min + "分" + sec + "秒"; この部分を、画像を表示するような、文字通り「HTML」になるようにしてみてください。 あえて書く必要はないと思いますが、画像を表示するHTMLタグは <img> です。 最初に<img>を書いておいて、srcだけを変えるなどの方法もありますが、 それは追々やっていく事でしょうし、いきなり応用から始めるのは不可能だと思います。
- babu_baboo
- ベストアンサー率51% (268/525)
１です。ていせいです。まいなすちになるとへんだった。 (function(a,b,d){var e="a,b,c,d,e,f".split(",").map(a),c=86400-(+new Date/1E3+32400)%86400|0;setInterval(function(){(b(--c/3600)+b(c/60%60)+b(c%60)).split("").forEach(d,e);c<1&&(c=86400)},1E3)})(function(a){return document.getElementById(a)},function(a){return(a<10?"0":"")+(a|0)},function(a,b){this[b].alt="dg"+a+".gif"}); 2様がいうように、ひとけたづつぶんかいしてますが、 innerHTML をつかうのは、 setInterval に、もじれつをわたすぐらい、いけてないとおもう。
補足
何かわかりませんんが、コレ表示されないです...
＞結局自分が書いたコードを使ってるんですが... うわー(笑) ＞document.getElementById('cd').innerHTML= "今日の終わりまであと" + hour + "時間" + min + "分" + sec + "秒"; ここのhour、min、secを一桁ずつ分割してimgタグで表示。
補足
やってみたんですけど、動きません。
- babu_baboo
- ベストアンサー率51% (268/525)
> 結局自分が書いたコードを使ってるん らくたんするひともいるかもしれないのだから・・・ <!DOCTYPE html> <title></title> <body> <div> <img src="dg0.gif" alt="h" id="a"> <img src="dg0.gif" alt="h" id="b"> <img src="dga.gif" alt=""> <img src="dg0.gif" alt="m" id="c"> <img src="dg0.gif" alt="m" id="d"> <img src="dga.gif" alt=""> <img src="dg0.gif" alt="d" id="e"> <img src="dg0.gif" alt="d" id="f"> </div> <script> //ひつようないなら、いかの２ぎょうをこめんとあうとしてね if(!Array.prototype.map)Array.prototype.map=function(b,e){var c=this.length;if(typeof b!="function")throw new TypeError;for(var d=Array(c),a=0;a<c;a++)a in this&&(d[a]=b.call(e,this[a],a,this));return d}; if(!Array.prototype.forEach)Array.prototype.forEach=function(b,c){var d=this.length;if(typeof b!="function")throw new TypeError;for(var a=0;a<d;a++)a in this&&b.call(c,this[a],a,this)}; //ほんたい (function(a,b,d){var e="a,b,c,d,e,f".split(",").map(a),c=86400-(+new Date/1E3+32400)%86400|0;setInterval(function(){(b(--c/3600)+b(c/60%60)+b(c%60)).split("").forEach(d,e)},1E3)})(function(a){return document.getElementById(a)},function(a){return(a<10?"0":"")+(a|0)},function(a,b){this[b].src="dg"+a+".gif"}); </script>
補足
最後に一つだげ質問したいんですけど、＃１のコードはなぜダメなんですか？ 「まいなすちになるとへんだった。」というのは、一体どういうこと何でしょうか？ ※返事待ってます。 ※是非、宜しくお願いします。