WEB上手 - おすすめパソコン選び・用途別カスタマイズ法紹介

  • このサイトについて
  • サイトマップ
  • お問い合わせ

WEB上手トップ > JavaScript > カレンダーを表示する

JavaScript

カレンダーを表示する

JavaScriptで表示するカレンダーです。リンクの設定や前後の月を閲覧出来る、カレンダー(リンク機能付き)もあります。日本の祝日表示にも対応していますが、「春分の日」や「秋分の日」は年によって日にちが変わったり、「祝日と祝日に挟まれている日は休日になる」等の変則的な休日が存在したりと、日本の祝日は少々複雑で、検証はしていますが正常に表示されない場合もありますのでご注意ください。改めて日本の祝日の複雑さを実感しました。。。

カレンダーはファイルをダウンロードしてお使いください。また、祝日が変更になった場合は、スクリプトの「祝日の設定」を変更する必要があります。「国民の祝日」に関する法律は「国民の祝日」について(内閣府ホームページ)および「国民の祝日」(Wikipedia)を参考にさせていただいています。

ダウンロードカレンダーの必要ファイルのダウンロード (3KB)
   ※ご利用規定に同意出来る方のみご利用ください。

    特長

  • 現在の日付をわかりやすく表示します。
  • 日本の祝日表示にも対応しています。マウスオーバーで祝日名を表示します。
  • CSSを変更することで、色や大きさなどのデザインも変更出来ます。

サンプル

  • まずはカレンダーの必要ファイルをダウンロードします。
  • 「ディレクトリ構成」に従って「calendar」フォルダをアップロードしてください。
    今回はアップロードの際は、全て「アスキーモード」でアップロードします。
  • 「記述」に従ってカレンダーを設置したいページに記述します。
  • 「サンプル」のように、カレンダーが表示されれば完成です。
  • ディレクトリhome
  • テキストindex.html (カレンダー設置ページ)
  • ディレクトリcalendar
  • テキストcalendar.js
  • テキストcalendar.css

<html>
<head>
<title>カレンダー設置ページ</title>

<link rel="stylesheet" type="text/css" href="calendar/calendar.css">

</head>
<body>

<script type="text/javascript" src="calendar/calendar.js"></script>

</body>
</html>

更新履歴

2008/08/01  ver1.0.0 ・新規公開

ページの先頭へ戻る



WEB上手TOP | JavaScript | PHP | Flash | Material | このサイトについて | サイトマップ | お問い合わせ

Copyright (C) 2007-2008 WEB-JOZU. All Rights Reserved.