画像カウントダウン当時以降を0日に表示したい
- JavaScriptを使用して、画像でカウントダウン表示しようとしています。
- 指定日までの残り日数を一桁の「01」のように表示したいです。
- 下記の記述で誤っているところがあれば教えてください。
- ベストアンサー
画像カウントダウン当時以降を0日に表示したい
javascriptにて画像でカウントダウン表示しようとしています。 下記の質問を参考にしましたが、その当日を過ぎると、カウントアップしてしまいます。 03・02・01・00・01・02・・・ ↑ 当日 指定日まで画像カウントダウン表示一桁の残り日数を「01」のようにしたい http://okwave.jp/qa/q5901649.html 下記の記述で誤っているところあれば教えて頂きたいのですがわかりますでしょうか？ <SCRIPT LANGUAGE="JavaScript"> <!-- dir = "number_sss2012/"; date1 = new Date(); date2 = new Date(2012, 8, 19); // YYYY, MM - 1, DD d = (date2.getTime() - date1.getTime()) / (24 * 60 * 60 * 1000); d = Math.abs(Math.ceil(d)); s = d.toString(); for (i = 0; i < s.length; i++) { if ( d < 0 ) { s = "00"; } else { s = d.toString(); if ( d < 10 ) s = "0"+s; } document.write("<IMG SRC=\"" + dir + s.charAt(i) + ".png\">"); } // --> </SCRIPT>
- mamioki
- お礼率100% (3/3)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
＞その当日を過ぎると、カウントアップしてしまいます。 計算方法として指定日と今日で日数の引き算をしているので、指定日を過ぎるとマイナスの日数になるのですが… d = Math.abs(Math.ceil(d)); の部分で絶対値をとる様になっているので、わざわざ-1日を1日に変えてしまっているのが原因ではないですか？
関連するQ&A
- 指定日まで画像カウントダウン表示一桁の残り日数を「01」のようにしたい
指定日まで画像カウントダウン表示一桁の残り日数を「01」のようにしたい。当日以降は「00」で停止させたい ある指定日時までの画像カウントダウン表示を以下のようにjavascriptで作成して、残り日数の数字を imageファイルで表示しているのですが、残りが一ケタになったときに「02」「01」のようにする、 また、当日が来たら「00」で止まるようにしたいのですが方法がわかりません。 javascriptで上記のような仕様にすることは可能なのでしょうか。 よろしくお願いします。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <script language="javascript"><!-- dir = "img/"; date1 = new Date(); date2 = new Date(2010, 11, 30); // YYYY, MM - 1, DD d = (date2.getTime() - date1.getTime()) / (24 * 60 * 60 * 1000); d = Math.abs(Math.ceil(d)); s = d.toString(); for (i = 0; i < s.length; i++) { document.write("<IMG SRC=\"" + dir + s.charAt(i) + ".gif\">"); } //--></script> </head> <body> <script src="js/date.js"></script>日 </body> </html>
- ベストアンサー
- JavaScript
- カウントダウンを何個も表示したいのですが・・・
こんばんは。 「次の誕生日まであと○日」というカウントダウンを自動で表示したくて 検索してみたところ，JavaScriptで書くことが分かりました。 （JavaScriptの書き方は全く知りません。） とあるHPで，以下のように書けば良いと習い <SCRIPT LANGUAGE="JavaScript"> <!-- var now = new Date(); var xday = new Date(2004, 9-1, 15); count = Math.ceil( (xday.getTime() - now.getTime()) / (24*60*60*1000) ); document.write("<FONT style='font-size : 16px; color : #666666'>"); document.write("次の誕生日まであと "); document.write(count); document.write("日 です</FONT>"); //--> </SCRIPT> このように書いたら，無事できました。 しかし， 「次の誕生日まであと○日」 「○さんの誕生日まであと○日」 というように，改行して2つのカウントダウンを表示したく HTMLしか分からないので<br>を入れてみたのですが カウントダウンが2つとも表示されません。 改行して表示するにはどうしたら良いのでしょうか。 どうか教えてください。よろしくお願いいたします。
- ベストアンサー
- HTML
- カウントダウンのタグ
おバカな質問でごめんなさいです(T_T) 笑わないでね？！ 呆れないでね？！ カウントダウンのカウンター（？）を置きたくて いろんなサイトを見て作ろうと思ったのですが これじゃ～表示されなくて… 何が足りないですか？ （）の中ってどうするのですか？ たぶん… メチャクチャだと思うのでここに質問すること事態 恥ずかしくて迷いましたが宜しくお願いします。 m( _"_ )mペコ♪ <!-- var set_y = 2005; var set_m = 9; var set_d = 5; var now = new Date(); var spday= new Date(set_y,set_m-1,set_d); a = (spday.getTime() - now.getTime())/(24*60*60*1000); a= Math.ceil(a); if(a >0) document.write("あと",a,"日で○○○です。"); else if(a==0) document.write("<h2>○○○開催！！</h2>"); else if(a <0) document.write("○○○",-a,"日過ぎました・・・"); --> <script language="javascript"> <!-- //--> </script>
- ベストアンサー
- HTML
- JavaScriptでイベントまでのカウントを作りたい。
教えてください。JavaScript初心者です。 JavaScriptでイベントまでのカウントを作りたいのですが、 日にちを画像でだして、指定した日がきたら、画像で差し替えるようにしたいのですが、どうすればいいのでしょうか？ ※現在は指定した日がきたら、「おめでとう」の文字がでるようにしてます。 書いたタグは下記になります。 アドバイスをお願いします。 <script language="JavaScript"><!-- var now = new Date(); var point = new Date(2009,8-1,25); var countdown = Math.ceil( ( point.getTime() - now.getTime() ) / (1000*60*60*24) ); if(countdown > 0) { document.write('countdown '); } else { document.write('おめでとう！'); } // --></script>
- 締切済み
- JavaScript
- 指定日時までのカウントダウン
指定日時までのカウントダウンで、数字を画像で表示させたモノを作りたいのですが、 いろんなサンプル等を見ながら作ってみたものの、うまくいきません。。。 アドバイスをお願い致します。 <html> <head> <title>指定日までの残り日数+時間を画像で表示する</title> <script language="JavaScript"><!-- function xDay(y,m,d,hh,mm,ss) { today = new Date(); xday = new Date(y,m-1,d,hh,mm,ss); dayMS = (24*60*60*1000,60*60*1000); days = Math.floor((xday.getTime()-today.getTime())/(24*60*60*1000)); hours = Math.floor(((xday.getTime()-today.getTime())%(24*60*60*1000))/(60*60*1000)); minutes = Math.floor((((xday.getTime()-today.getTime())%(24*60*60*1000))/(60*1000))%60); seconds = Math.floor((((xday.getTime()-today.getTime())%(24*60*60*1000))/1000)%60%60); if (seconds<10) { seconds = "0"+seconds; } if (minutes<10) { minutes = "0"+minutes; } if (hours<10) { hours = "0"+hours; } days += ""; for (i=0; i<days.length; i++) document.write("<img src='clock/"+days.charAt(i)+".gif'>"); hours += ""; for (i=0; i<hours.length; i++) document.write("<img src='clock/"+hours.charAt(i)+".gif'>"); minutes += ""; for (i=0; i<minutes.length; i++) document.write("<img src='clock/"+minutes.charAt(i)+".gif'>"); seconds += ""; for (i=0; i<seconds.length; i++) document.write("<img src='clock/"+seconds.charAt(i)+".gif'>"); } // --></script> </head> <body> <script language="JavaScript"><!-- xDay(2008,4,21,12,00,00); // --></script> </body> </html>
- ベストアンサー
- JavaScript
- javascriptにおける指定日時までのカウントダウン
いろいろなサイトを見回りながら「指定日までの残り日数と時間を表示する」のをjavascriptで動かしたいのですがリアルタイムに秒が進んでくれません。知識のある方はどうか間違えてる点のご教授お願いします。 <html> <head> <title>指定日までの残り日数と時間を表示する</title> </head> <body> <script language="JavaScript"><!-- function xDay(y,m,d,hh,mm,ss){ today = new Date(); xday = new Date(y,m-1,d,hh,mm,ss); dayMS = (24*60*60*1000,60*60*1000); days = Math.floor((xday.getTime()-today.getTime())/(24*60*60*1000)); hours = Math.floor(((xday.getTime()-today.getTime())%(24*60*60*1000))/(60*60*1000)); minutes = Math.floor((((xday.getTime()-today.getTime())%(24*60*60*1000))/(60*1000))%60); seconds = Math.floor((((xday.getTime()-today.getTime())%(24*60*60*1000))/1000)%60%60); myDisp=""; if (days != 0)myDisp+=days+"日と "; if (hours != 0)myDisp+=hours+"時間 "; if (minutes != 0)myDisp+=minutes+"分 "; myDisp+=seconds+"秒"; document.myForm.myFormDate.value = myDisp; setTimeout("xday()",1000); } // --></script> <form name="myForm"> <input type="text" size="35" name="myFormDate"> <script language="JavaScript"><!-- xday(); // --></script> </form> <script language="JavaScript"><!-- xDay(2008,9,13,15,00,00); // --></script> </body> </html>
- 締切済み
- JavaScript
- 日数カウントダウンが、ブラウザによって文字化けする。
日数カウントダウンが、ブラウザによって文字化けする。 以下のように、日数のカウントダウンを表示しているのですが、 IEでは正常に表示されるのですが、 safari、firefoxでは、文字化け（数桁の数字が表示）します。 （その他のブラウザは未確認です。） ↓(日数カウントダウンのソース)================================= <script language="JavaScript"> <!-- today=new Date() next_date=new Date(2011, 1, 1); //2011/1/1までの日数を表示。 last=Math.floor((next_date.getTime()-today.getTime())/(24*60*60*1000))+1; document.write("あと",Math.floor(last),"日"); // --> </script> ↑(日数カウントダウンのソース)================================= ブラウザの設定も確認したのですが、原因がわかりませんでした。 ご存知の方、ご教授願います。よろしくお願いします。
- ベストアンサー
- JavaScript
- カウントダウンタイマー
カウントダウンタイマーをJavascriptでもって設置したのですが表示される度に定時からスタートする場合はどうやればよいのでしょうか？つまり仮に4月1日を締め切りにしてそれをすぎたら終了ではなく、常に後3日までや5日までのカウントダウンをしたいのです。言葉足らずな初心者で申し訳ないのですがよろしくお願い致します。以下現在使用のscriptです。 <SCRIPT language=JavaScript> <!-- millenium = new Date(2007,3,31,23,59,00) function display() { today = new Date() myMsec= millenium.getTime()-today.getTime(); time0 = Math.floor(myMsec/(1000*60*60*24));// カウントダウン用'日' 取得 myMsec -= (time0*(1000*60*60*24)); // 経過秒から'時'を引く time1 = Math.floor(myMsec/(1000*60*60));// カウントダウン用 '時' 取得 myMsec -= (time1*(1000*60*60)); // 経過秒から'時'を引く time2 = Math.floor(myMsec/(1000*60)); // カウントダウン用 '分' 取得 myMsec -= (time2*(1000*60));// 経過秒から'分'を引く time3 = Math.floor(myMsec/1000);// カウントダウン用 '秒' 取得 myMsec -= (time3*(1000)); // 経過秒から'秒'を引く time4 = Math.floor(myMsec/10);// カウントダウン用 '少数秒' 取得 for(i=0;i<2;i++){ time2 = '' + '0' + time2; } for(i=0;i<2;i++){ time3 = '' + '0' + time3; } for(i=0;i<2;i++){ time4 = '' + '0' + time4; } time2 = time2.substring(time2.length - 2,time2.length); time3 = time3.substring(time3.length - 2,time3.length); time4 = time4.substring(time4.length - 2,time4.length); time0 = time0 - 31; if((millenium - today) > 0){ document.f.days.value = "締め切りまで"+time0+"日と"+time1+":"+time2+":"+time3+"."+time4+"です" }else{ document.f.days.value = "受け付けは終了しました" } tid = setTimeout('display()', 10) } display() // --> </SCRIPT>
- ベストアンサー
- JavaScript
- JavaScriptで平日のみをカウントダウンするには?
以下のプログラムは土日は無視されますが祝日も平日としてカウントダウンされてしまいます。 土、日、祝日を含まない平日のみをカウントダウンするプログラムを教えていただけますでしょうか？ <html> <head> <script language="JavaScript"> <!-- function countdown() { var kyou = new Date(); var kinen = new Date("Sep 31, 2008 00:00:00"); // 目標日との差のミリ秒(の絶対値) var tdiff = Math.abs(kinen.getTime() - kyou.getTime()); // 日数 var days = 0; var mae; if (kinen.getTime() > kyou.getTime()) { // 目標日以前なら mae = true; // 曜日を取得(日曜が0、月曜が1、...、土曜が6) var weekday = kyou.getDay(); while (tdiff > 0) { if (weekday > 0 && weekday < 6) { ++days; } weekday = weekday != 6 ? weekday + 1 : 0; tdiff -= (24 * 60 * 60 * 1000); } } else { // 目標日以降(含む当日)なら mae = false; // 曜日を取得(日曜が0、月曜が1、...、土曜が6) var weekday = kinen.getDay(); // 残りが1日未満になるまで繰り返す // 元のプログラムがMath.ceilで切り上げを行っているため、 // それにあわせるための処置 while (tdiff > (24 * 60 * 60 * 1000)) { if (weekday > 0 && weekday < 6) { ++days; } weekday = weekday != 6 ? weekday + 1 : 0; tdiff -= (24 * 60 * 60 * 1000); } } var meate="あ"; with(Math){ var kotoba; if (mae) { // 目標日前なら-1日する --days; kotoba = meate + "と " + days + "日 です。"; } else { if (days == 0) { kotoba = "も" + meate + "です！"; } else { kotoba = meate + "から" + days + "日が過ぎました。"; } } } document.write(kotoba); } //--> </script> </head> <body> <center><table border=2 bordercolor=00ffff cellpadding=5 cellspacing=0> <tr bgcolor="#ffffff"><td bgcolor="#ffff80"> <script language="JavaScript"> <!-- countdown(); //--> </script> </td></tr> </table></center> </body> </html> ご教授の方を宜しくお願いします。
- ベストアンサー
- JavaScript
- document.write()の()内にタグを使用したいのですが
質問いたします。 カウントダウンに関する質問なのですが、例えば以下のスクリプトの中でdocument.write()の()内の".happy."の部分の色を変えたいのですが、タグの挿入のルールが解りません。 document.write("誕生日まであと",<font color="#FF0000">happy</font>," 日") とか色々何パターンか試して見たのですが、間違っているようで表示されなくなってしまいます。 <SCRIPT language="JavaSCRIPT"> <!---- var set_y = 2006; //年 var set_m = 10; //月 var set_d = 01; //日 var now = new Date(); var spday= new Date(set_y,set_m-1,set_d); happy = (spday.getTime() - now.getTime())/(24*60*60*1000); happy = Math.ceil(happy); if(happy >0) document.write("誕生日まであと ",happy," 日"); //カウントダウン else if(happy ==0) document.write("誕生日おめでとう"); //当日 else if(happy <0) document.write("来年もよろしくね！"); //その後 //------> </script> 適切な場所に<font color="#FF0000">～</font>を入れる書き方をお教え頂ければ幸いでございます。よろしくお願い致します。
- ベストアンサー
- JavaScript
お礼
早速のご回答ありがとうございます！ ご指摘の部分を下記に変更してみたところうまく動くようになりました。 d = Math.floor(Math.ceil(d)); また、こちらでも同様に動作しました。 d = Math.ceil(Math.ceil(d)); なお、ご指摘の部分をまるっと削除すると動作はしませんでした。 整数化すると動作し始めました。 整数になるなら、切捨てでも切り上げでも関係はないのですかね。 どっちみち日付の計算で小数点が出ることはないですものね。 これで正しいか分らないのですが、きちんと動作するようですので これで行きたいと思います。 とても勉強になりました。 助かりました！！