画像(サンプル画像アップ致しました)のようにしたいです。
先日私のご質問にお答え頂きました方に大変感謝申し上げます。
じつは昨日からずっとスクリプトと格闘しています。
もうお手上げです。ヒントでもいいです。お願いします。
詳細=====
オープンorクローズの画像の下にデジタル時計をつけるにはどうしたらよいのでしょうか??
またJSファイルを外部化したいです。
画像は上部に<オープン画像>、<クローズ画像>がきて、
下段にデジタル時計が入ります。
時計は0~9までを、tokei/x.png...(x=0,1,2,3,,,,)として秒ごとに真ん中の『:』※tokei/chome.pngが点灯させたいです。
ここから下段に時計を入れたいのと、このファイルを外部に分けたいのですが、html内の画像の位置(htmlファイルに何と書いたら良いのか)をどうしたら良いのか分かりません。
お手数かけます。宜しくお願いします。
<script language="JavaScript"><!--
d = (new Date()).getDay();
h = (new Date()).getHours();
m = (new Date()).getMinutes();
if (d == 3) {
Discg = "tokei/close.png";
}else if ((h>12 && h<19) || (h == 12 && m >= 0) && (h == 19 && m <= 30)) {
Discg = "tokei/open.png";
}else {
Discg = "tokei/close.png";
}
document.write('<IMG src="' + Discg + '" border="0">');
</script>
A 回答 (4件)
- 最新から表示
- 回答順に表示
No.4
- 回答日時:
前の質問に補足が出てたのね?!見てませんでした。
>デクリメント
HTML文書の中に"--"が出てきては、文法上まずい。
なので外部ファイルにしてね。という意味。
>悪意は・・・
それは、himajin100000さんに向けてでした。
たぶん、himajin100000さん、いわく、
「普段回答者としているものよ、UTCも考えろよ!
そして、どうせやるなら、小手先の数値でごまかすのではなく
dateオブジェクトがあるんだから、計算も「その型」でやることも覚えろ~!」
と言いたかったのかもしれません。(単に暇だったかもしれませんが・・)
と、解釈できているのに、あえて、その小手先の数値で計算して短くコードを書き、
苦労しただろうあの長いコードを無視したかのような事だったので・・・。
さて、ご要望のもの書いてみましたよ。どうですか?
No.3
- 回答日時:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title></title>
<style type="text/css">
#clock {
margin: 0px;
background-color: #000;
text-align: center;
color: white;
}
</style>
<body>
<p id="clock">
<img src="tokei/tekitou.png" alt="*" id="open"><br>
<img src="tokei/0.png" alt="*" id="hour1">
<img src="tokei/0.png" alt="*" id="hour2">
<img src="tokei/colon.png" alt=":" id="colon">
<img src="tokei/0.png" alt="*" id="min1">
<img src="tokei/0.png" alt="*" id="min2"><br>
Openhour 12:00-19:30 / Close Wednesday
</p>
<script type="text/javascript">
(function ( ) {
var images = [ ]
var cnt = 14;
var path = 'tokei/';
var state = 12;
var colon = document.getElementById( 'colon' );
while( cnt-- )
(images[ cnt ] = new Image()).src = path + cnt + '.png';
images[10].src = path + 'close.png';
images[11].src = path + 'open.png';
images[12].src = path + 'colon.png';
images[13].src = path + 'black.png';
setInterval( function ( ) {
state = 12 == state ? 13: 12;
colon.src = images[ state ].src;
}, 500);
setInterval( function ( ) {
var d = new Date;
var t = d.getHours() * 100 + d.getMinutes()
var n = 10000 + t + '';
var s = d.getDay() == 3 || t < 1200 || 1930 < t ? 10: 11;
document.getElementById( 'hour1' ).src = images[ n.charAt(1) ].src;
document.getElementById( 'hour2' ).src = images[ n.charAt(2) ].src;
document.getElementById( 'min1' ).src = images[ n.charAt(3) ].src;
document.getElementById( 'min2' ).src = images[ n.charAt(4) ].src;
document.getElementById( 'open' ).src = images[ s ].src;
}, 1000);
})();
</script>
全角空白は半角に。スクリプトが動かない人のことも考えましょう~!
No.1
- 回答日時:
phpをお勉強中で、JavaScriptにも箸を付けざるをえなくなっている初心者ですが、試しにやってみました。
質問者さんの考えられているデザインに添っているとは思えませんが、何かの足しになるかもしれませんので、投稿させていただきます。<HTML>
<TITLE>rclock1</TITLE>
<SCRIPT language="JavaScript">
function getClock(){
now = new Date();
hou = now.getHours();
min = now.getMinutes();
if(10<=hou && hou<22){
document.myImg.src="kaiten.gif"
} else {
document.myImg.src="heiten.gif"
}
document.form1.clock.value=hou + ":" + min;
setTimeout("getClock()",60000);
}
</SCRIPT>
<BODY onLoad="getClock()" bgcolor="black">
<IMG src="dummy.gif" name="myImg">
<FORM name="form1">
<INPUT TYPE="text" name="clock" size=10" style="border:0; color:white; background:transparent;">
</FORM>
</BODY>
</HTML>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・歩いた自慢大会
- ・許せない心理テスト
- ・字面がカッコいい英単語
- ・これ何て呼びますか Part2
- ・人生で一番思い出に残ってる靴
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・初めて自分の家と他人の家が違う、と意識した時
- ・単二電池
- ・チョコミントアイス
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
for文について
-
画像の下に説明文をつけて切り...
-
複数画像のロールオーバーの効...
-
クリックとダブルクリック
-
jQueryでサーバー上のファイル...
-
javascript 時計24時間表示
-
HPB_SCRIPT_ROV_50
-
setAttributeによる画像の差し替え
-
【javascript】ロールオーバー...
-
imgのaltとtitleの要素を抜き出...
-
オンマウスで画像と文字を同時...
-
画像と文字を同時に切り替えたい
-
JAVAで画像をボタンで切り替え...
-
MAX関数を使ってからLEFT JOIN...
-
画像のランダム表示、及び画像...
-
iframe内のリンクが飛ばないの...
-
フッター上部に謎の隙間
-
JSPでの画像ファイル表示
-
テキストエリア内の一部の文字...
-
jqueryで要素の中身を要素の外...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
jQueryでサーバー上のファイル...
-
window.openで値の渡し方を教え...
-
JAVAで画像をボタンで切り替え...
-
HPB_SCRIPT_ROV_50
-
this.src等のthisについて
-
画像と文字を同時に切り替えたい
-
画像の下に説明文をつけて切り...
-
imgのsrcに値を設定するには
-
画像アップロードしたい
-
JavaScriptで画像置換えてクリ...
-
画像をランダムな座標に一定の...
-
Javaにて画像を変更させる動作...
-
クリッカブルマップでリモート...
-
イベントハンドラを完全に外部...
-
画像の入れ替え
-
【javascript】マウスオンで画...
-
JavaScriptを外部ファイルにす...
-
オンマウスで画像と文字を同時...
-
画像をクリックして変数に値を代入
-
HTMLページ内のタグに対しての...
おすすめ情報