관리 메뉴

nkdk의 세상

JS :: 달력 본문

My Programing/HTML and JavaScript

JS :: 달력

nkdk 2008. 6. 16. 10:32

<html>
<script language="JavaScript">
<!--

function get_lastday(year, month) {  // 각 달의 마지막 날을 계산 - 입력값 : 현재년, 달
var last_month = new Array(31,  28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);

if (((year%4 == 0) && (year%100 != 0)) || (year%400 ==0))  // 윤달에 따른 2월마지막 날을 설정합니다.
  last_month[1] = 29;
else
  last_month[1] = 28;

return last_month[month];
}

function weekday_info(in_year, in_month) {  // 테이블처음부터 요일행까지 작성
var dsp_month = in_month +1;
var in_dsp_text = "<div align=center>";
in_dsp_text += "<table cellspacing=2 cellspacing=1>";
in_dsp_text += "<tr>";
in_dsp_text += "<td colspan=7 bgcolor=#bbddff align=center>";
in_dsp_text += "<font color=black size=6><b>";
in_dsp_text += in_year + "년 " + dsp_month + "월 ";
in_dsp_text += "</b></font>";
in_dsp_text += "</td>";
in_dsp_text += "</tr>";

in_dsp_text += "<tr>";
in_dsp_text += "<td colspan=7 bgcolor=white align=center>";
in_dsp_text += "<img src=nudu.gif>";
in_dsp_text += "</td>";
in_dsp_text += "</tr>";

var dsp_weekday = new Array("일", "월", "화", "수", "목", "금", "토");
in_dsp_text += "<tr align=center valign=center>";
for (var i=0; i<=6; i++) {
  in_dsp_text += "<td bgcolor=#f0f3fd width=40 height=35><b>";
  in_dsp_text += dsp_weekday[i];
  in_dsp_text += "</b></td>";
}

in_dsp_text += "</tr>";
return in_dsp_text;
}

function make_drawcal(firstday, lastdate, date) {  // 날짜생성 - 입력값 : 현재달의 1일자 요일, 마지막날, 현재날짜
var dsp_text = "";  // 출력할 태그저장변수
var digit_day = 1;  // 날짜담당변수
var curcell = 0;  // 요일담당변수

last_day_row = Math.ceil((lastdate + firstday) / 7);  // 일자에 따른 행수를 계산

for (var day_row=1; day_row <= last_day_row; day_row++) {  // 행의 생성을 제어
  dsp_text += "<tr align=right valign=top bgcolor=white>";
  for (var col=1; col <= 7; col++) { // 열의 생성의 제어(요일부분)
   if (digit_day > lastdate) {  // 마지막날 이후 공란을 생성
    dsp_text += "<td>&nbsp;</td>";
   } else if (curcell < firstday) {  // 첫날이전의 공란을 생성
    dsp_text += "<td>&nbsp;</td>";
    curcell++;
   } else {  // 날짜를 생성한다.
    dsp_text += "<td height=40>";

    if (col == 1) { // 일요일이면
     dsp_text += "<font color=red>";
     dsp_text += digit_day;
     dsp_text += "</font>";
    } else if (col == 7) {  // 토요일이면
     dsp_text += "<font color=blue>";
     dsp_text += digit_day;
     dsp_text += "</font>";
    } else if (digit_day == date) {  // 오늘이면
     dsp_text += "<b><font size=3 color=green>";
     dsp_text += digit_day;
     dsp_text += "</font></b>";
    } else dsp_text += digit_day;
    dsp_text += "</td>";
    digit_day++;  // 계속해서 날짜를 증가한다.
   }
  }
  dsp_text += "</tr>";
}
dsp_text += "</table>";
dsp_text += "</div>";

return dsp_text;
}
// -->
</script>
<body>
<script language="JavaScript">
<!--

var now = new Date();
var year = now.getYear();
var month = now.getMonth();
var date = now.getDate();

var first_day_info = new Date(year, month, 1);
var first_day = first_day_info.getDay();  // 현재 달의 1일자 요일을 안다.

var mydays = get_lastday(year, month);  // 각달의 마지막일자정보를 가져온다.
var all_dsp_text = weekday_info(year, month);  // 테이블처음부터 요일행까지 저장
all_dsp_text += make_drawcal(first_day, mydays, date);  // 나머지를 저장한다.

document.write(all_dsp_text);

// -->
</script>

</body>
</html>