デジタル時計の作り方

ビデオ: SHIMATORA電子工作 No.13 〜7セグLED時計キットの作成〜

コンテンツ

説明書
どうやって
参考文献

理想的なデジタル時計モデルがまだ見つかっていない場合は、HTAプログラミング言語を使用して独自の時計モデルを作成できます。 Internet Explorerが提供する機能を使用して、この言語はすべてのHTMLおよびJavaScript機能をデスクトップに組み込みます。開発者は数行のJavaScriptを使用してWebページにデジタル時計を追加できます。ただし、HTA言語では、CSSプロパティを使用してカスタムテンプレートを作成することができます。

説明書

時間を知るために物理的な時計を持っている必要はありません。 （Martin Poole /フォトディスク/ゲッティイメージズ）

メモ帳を開き、新しい文書に次の文を貼り付けます。

HTAテスト

type = "text / css"> .clockStyle {border：太い青の点線。背景色：＃FFFF00。幅：100ピクセル。高さ：20ピクセル。 text-align：center。 }
最後に表示されるこのコードの「style」セクションは、「clockStyle」というクラスを定義します。このクラスは時計の外観を決定します。たとえば、境界線属性は、時計回りに青い点線の境界線を挿入します。背景は黄色です。幅と高さのパラメータは、オブジェクトのピクセル解像度を特徴付けます。
前の手順のコードの下に次のJavaScriptブロックを追加します。

コードの上部にある "windowWidth"と "windowHeight"変数に注意してください。それらはデジタルクロックを含むウィンドウのサイズを制御します。必要に応じてこれらの値を変更してください。
最後のセクションで説明した以下のコードを追加します。

>

これにより、要素「div」、つまり時計の本体が作成されます。クラスの属性は、前述のCSSスタイル宣言を参照します。
「Ctrl」と「S」を同時に押して、「名前を付けて保存」ウィンドウに表示される「ファイル名」フィールドに「DigitalClock.hta」と入力します。「保存」をクリックしてファイル名を保存してください。
「Windowsエクスプローラ」を開いてファイルを見つけてください。ファイルをダブルクリックしてデジタル時計を表示します。

どうやって

ドキュメントの「style」セクションのCSSプロパティを変更して時計をカスタマイズします。たとえば、背景をピンクに変更するには、コード内の「yellow」を「pink」に置き換えます。通常、時計は毎秒表示を更新します。リフレッシュレートを変更するには、コード内の "1000"を2000などの別の値に変更します。これにより、2秒ごとにクロックが変更されます。