質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.49%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

544閲覧

カウトダウン機能のjavascriptの文字サイズを画面サイズによって変えたい。

dstrykn

総合スコア20

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2017/10/31 12:52

下記は日付のカウントダウン機能のjavascriptのコードです。
pcサイズはフォントサイズ50pxなのですが、スマホではもう少し小さくしたいと考えています。
javascriptがわからないなりに色々いじってみたのですが、うまくいきません。
javascriptに詳しい人ご教授お願いいたします。

<head> <title>countdown</title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> </head> <body style="margin:0; padding:0; text-align:center; font-weight:bold;"> <script type="text/javascript"> <!-- var nannen = 2017; var nangatsu = 3; var nannichi = 27; var nanji = 23; var nanpun = "59"; var iro = "#00469f"; var haikei = ""; var size = 50; var haba = ""; var kaigyou = "しない"; var word = ""; function div() { if(iro != ""){ iro = "color:" + iro + ";"; } if(haikei != ""){ haikei = "background-color:" + haikei + ";"; } if(size != ""){ size = "font-size:" + size + "px;"; } if(haba != ""){ haba = "width:" + haba + "px;"; } document.write("<div id='timer'style='padding-top:0px;padding-bottom:0px;padding-left:5px;padding-right:5px;" + iro + haikei + size + haba + "line-height:1.1;'></div>"); } function timer(){ if(nangatsu == 1){ nangatsu = "January"; }else if(nangatsu == 2){ nangatsu = "February"; }else if(nangatsu == 3){ nangatsu = "March"; }else if(nangatsu == 4){ nangatsu = "April"; }else if(nangatsu == 5){ nangatsu = "May"; }else if(nangatsu == 6){ nangatsu = "June"; }else if(nangatsu == 7){ nangatsu = "July"; }else if(nangatsu == 8){ nangatsu = "August"; }else if(nangatsu == 9){ nangatsu = "September"; }else if(nangatsu == 10){ nangatsu = "October"; }else if(nangatsu == 11){ nangatsu = "November"; }else if(nangatsu == 12){ nangatsu = "December"; } limit_data = nangatsu + " " + nannichi + "," + nannen + " " + nanji + ":" + nanpun + ":00"; limit = new Date(limit_data); today = new Date(); days = Math.floor((limit-today)/(24*60*60*1000)); time1 = Math.floor(((limit-today)%(24*60*60*1000))/(60*60*1000)); time2 = Math.floor(((limit-today)%(24*60*60*1000))/(60*1000))%60; time3 = Math.floor(((limit-today)%(24*60*60*1000))/1000)%60%60; time4 = Math.floor(((limit-today)%(24*60*60*1000))/10)%100; if(time2 < 10){ time2 = '0' + time2; } if(time3 < 10){ time3 = '0' + time3; } if(time4 < 10){ time4 = '0' + time4; } if(kaigyou == "する"){ br = "<br>"; }else{ br = ""; } if((limit - today) > 0){ time = word + br + days + "日と" + time1 + "時間" + time2 + "分" + time3 + "秒" + time4; }else{ time = "あとわずか"; } document.all.timer.innerHTML = time; setTimeout('timer()',10); } // --> </script><SCRIPT language=JavaScript>div();timer();</SCRIPT> </body> </html>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

すごいスクリプトですね、これはスクリプトで指定した文字サイズが「あとわずか」と表示されるdivタグにインラインで記述されるためCSSの通常指定では優先負けしてる状態です。
仮に、以下のようにCSSを記述すれば反映はされるので、後は自分で試してください。

div{
font-size:24px !important;
}

投稿2017/11/01 05:45

shaak

総合スコア607

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

dstrykn

2017/11/01 14:46

ご回答ありがとうございます。 設定できました! CSSに指定の仕方が悪かったんですね。 本当に助かりました。ありがとうございます!
guest

0

投稿2017/10/31 13:33

編集2017/10/31 13:34
hota1024

総合スコア354

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

dstrykn

2017/10/31 13:47

ご回答ありがとうございます。 cssでしたら、ある程度わかるので色々試したのですが、JavaScriptに記述されている50pxが優先されるようでうまくいきません。 教えていただいたページを見て試しましたがやはりダメでした。 もしかしたら指定の仕方が間違っているのかもしれませんが。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.49%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問