Jahreskalender

Moderator: HTML-Laie

Antworten
Benutzeravatar
Hape
Administrator
Beiträge: 334
Registriert: Fr 22. Mai 2020, 00:33

Jahreskalender

Beitrag von Hape »

Bei diesem Kalender wird der jeweils aktuelle Monat dargestellt.

Code: Alles auswählen

<!--               Calendar of Events               -->
<!--  based on David Mrozinski's "Pop Up Calendar"  -->
<!--        modified by David Huff May, 2001        -->
<!--             davehuff@earthlink.net             -->
<script type="text/javascript" language="javascript">
<!--
// Calendar variables
var table_bg_color="#DFDFDF";var row_bg_color="";
var cell_bg_color="#DFDFDF";
var no_date_cell_color="Lightyellow";
var todays_cell_color="yellow";
var todays_text_color="#0000FF";
var event_text_color="Blue";
var title_text_color="blue";
var month_color="blue";
var days_text_color="#000066";
var date_text_color="#000066";
var table_width="800"
var cell_width="130";
var cell_height="85";
// Calendar events
var c_event = new Array()
  // January
  c_event[1] = new Array("","","","","","","","","","","Bingo<br>19:30 Uhr Schützenhaus","","","","","","","","","Jahreshauptversammlung Siedlergemeinschaft 19:00 Uhr Schützenhaus","","","Jahreshauptversammlung Schützenverein<br>15:00 Uhr Schützenhaus","","","","","","","","");
  // February
  c_event[2] = new Array("","","","Jahreshauptversammlung Bürgerverein<br>19:30 Uhr Schützenhaus","Wintervergnügen Siedlergemeinschaft 15:00 Uhr Schützenhaus","","","Bingo<br>19:30 Uhr Schützenhaus","","","","","Besenwerfen Schützenverein 14:30 Uhr Schützenhaus","","","","","","Skat<br>19:30 Uhr Schützenhaus","Dorfgemeinschaftspokal 09:30 Uhr Schützenhaus","","","","","","Boßeln gegen Golzwarden<br>14:00 Uhr Schützenhaus","","","");
  // March
  c_event[3] = new Array("","","","","Beafsteakball<br>19:30 Uhr Rosenburg","","","Bingo<br>19:30 Uhr Schützenhaus","","","","","","","","","Maibaumsitzung<br>19:30 Uhr Schützenhaus","","","","","","","","","","Marathonschießen<br>14:00 Uhr Schützenhaus","","","","");
  // April
  c_event[4] = new Array("","","","","","","","","Boitwarden räumt auf 09:00 Uhr Schützenhaus","","","Bingo<br>19:30 Uhr Schützenhaus","","","","","","","","","","Osterschießen<br>15:00 Uhr Schützenhaus","","","","","","Maibaumbinden 18:00 Uhr Schützenhaus","","Maibaumsetzen 18:00 Uhr Schützenhaus");  // May
  // May
  c_event[5] = new Array("","","","","","","Schützenfestball<br>20:00 Uhr Festzelt","Schützenumzug<br>14:00 Uhr Festzelt","","","","","","Kehrauspokal<br>14:00 Uhr Schützenhaus","","","","","","Maibaumabnahme<br>18:00 Uhr Maibaumplatz","","","","","","","","","","","");
  // June
  c_event[6] = new Array("","","","","","","","","","","Jugendschützenfahrt","Jugendschützenfahrt","Jugendschützenfahrt","","","","","","","","","","","","","Dorfgemeinschaftsausflug","","","","");
  // July
  c_event[7] = new Array("","","","","","","","","Jugendzeltlager Siedlergemeinschaft","Jugendzeltlager Siedlergemeinschaft","Jugendzeltlager Siedlergemeinschaft","Jugendzeltlager Siedlergemeinschaft","Jugendzeltlager Siedlergemeinschaft","Jugendzeltlager Siedlergemeinschaft","Jugendzeltlager Siedlergemeinschaft","","","","","","","","","","","","","","","","");
  // August
  c_event[8] = new Array("","","","","","","","","","","","","","","","","","","","","","","","","","","","Vogelschießen 14:00 Uhr Schützenhaus","","","");
  // September
  c_event[9] = new Array("","","","","","","","","","","","","","","","","","","","","","","","","","","","","","");
  // October
  c_event[10] = new Array("Staudenmarkt<br>14:00 Uhr Schützenhaus","LZO-Pokalschießen<br>10:00 Uhr Schützenhaus","","","","","","","","","Bingo<br>19:30 Uhr Schützenhaus","","","","","","","","","","","","","","","","","","Königsball<br>20:00 Uhr Schützenhaus","","");
  // November
  c_event[11] = new Array("","","","Laternenlauf","","","","Bingo<br>19:30 Uhr Schützenhaus","","","","","","","","","","","Skat<br>19:30 Uhr Schützenhaus","","","","","","","","","","","");
  // December
  c_event[12] = new Array("","","Weihnachtsfeier Bürgerverein und Siedlergemeinschaft 15:00 Uhr Kirchengemeinde Nord","","","","","","","","Weihnachtsfeier Schützenverein<br>15:00 Uhr Schützenhaus","","Bingo<br>19:30 Uhr Schützenhaus","","","","","Weihnachtsmarkt Bürgerverein<br>16:00 - 19:00 Uhr Maibaumplatz","","","","","","","","","","","","","");

function go_back(test_month,test_year)  {
    location.href="/kalender2.html?" + test_month + "," + (test_year-1);
  }
function go_forward(test_month,test_year)  {
    location.href="/kalender2.html?" + test_month + "," + (test_year+1);
  }

var test_it=location.search.substring(1);
var info = test_it.split(",");
var data_month=parseInt(info[0],10);
var data_year=parseInt(info[1],10);
var months=new Array("Januar","Februar","März","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember");
var the_date= new Date();
var the_month=the_date.getMonth();
var the_date_number=the_date.getDate();
var the_year=the_date.getFullYear();
var the_day=the_date.getDay();
if (location.search.length >0)  {
    var the_month=data_month;
    var the_year=data_year;
  }
var first_day= new Date(the_year,the_month,1);
var first_day=first_day.getDay();
var short_year=new String(the_year);
var short_year=short_year.slice(2,4);
var day_in_month=31;
if (the_month == 3 || the_month == 5 || the_month == 8 || the_month == 10) {
   var day_in_month=30;
}
if (the_month == 1) {
  var day_in_month=28;
}
if ( the_month == 1 && ( ((the_year % 4 == 0) && (the_year % 100 != 0)) || (the_year % 400 == 0) ) ) {
  var day_in_month=29;
}
  var day_counter=1;
document.write("<table bgcolor='"+table_bg_color+"' align='center' border='1' width='"+table_width+"' cellpadding='5' cellspacing='1'>");
document.write("<tr height='25'><td colspan='7'>");
document.write("<table bgcolor='"+table_bg_color+"' align='center' border='1' width='"+table_width+"' cellpadding='3' cellspacing='1'><tr bgcolor='"+row_bg_color+"' align='center' valign='top'>");

document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(00,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial,Arial'> Januar</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(01,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>Februar</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(02,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>März</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(03,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>April</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(04,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>Mai</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(05,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>Juni</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(06,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>Juli</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(07,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>August</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(08,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>September</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(09,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>Oktober</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(10,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>November</font></a></td>");
document.write("<td bgcolor='"+cell_bg_color+"' align='center' valign='middle'><a style='text-decoration:none' href='javascript:go_back(11,[the_year+1])'><font size='-2' color='"+month_color+"' face='MS Sans Serif,Arial'>Dezember</font></a></td>");
document.write("</tr></table></td></tr>");
document.write("<tr height='25'><td bgcolor='"+cell_bg_color+"' align='center' colspan='7'><font size='+2' color='"+title_text_color+"'><b><i>" + months[the_month] + " " + the_year + "</i></b></font></td></tr>");
document.write("<tr height='25'><td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='middle'><font color='"+days_text_color+"' size='-2'>Sonntag</font></td>");
document.write("<td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='middle'><font color='"+days_text_color+"' size='-2'>Montag</font></td>");
document.write("<td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='middle'><font color='"+days_text_color+"' size='-2'>Dienstag</font></td>");
document.write("<td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='middle'><font color='"+days_text_color+"' size='-2'>Mittwoch</font></td>");
document.write("<td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='middle'><font color='"+days_text_color+"' size='-2'>Donnerstag</font></td>");
document.write("<td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='middle'><font color='"+days_text_color+"' size='-2'>Freitag</font></td>");
document.write("<td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='middle'><font color='"+days_text_color+"' size='-2'>Sonnabend</font></td></tr>");
document.write("<tr height='"+cell_height+"'>");
for (i=0;i<(first_day);i++)  {
    document.write("<td bgcolor='"+no_date_cell_color+"' width='"+cell_width+"'> </td>");
  }
for (i=first_day;i<7;i++)  {
    var two_digit_year=new String(the_year);
    var two_digit_year=two_digit_year.slice(2,4);
    var the_date_string = new String(the_month+1) + "/" + new String(day_counter) + "/" + two_digit_year ;
    if (day_counter == the_date_number && the_date.getMonth() == the_month && the_date.getFullYear() == the_year)
      {
        document.write("<td bgcolor='"+todays_cell_color+"' width='"+cell_width+"' align='left' valign='top'><div align='right'><font size='-2' color='"+todays_text_color+"'><b>" + ' ' + day_counter + "</b></font></div><br><font color='"+event_text_color+"' size='-2'>" + c_event[the_month+1][day_counter-1] + "</font></td>");
        }
    else
      {
        document.write("<td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='top'><div align='right'><font color='"+date_text_color+"' size='-2'><b>" + day_counter + "</b></font></div><br><font color='"+event_text_color+"' size='-2'>" + c_event[the_month+1][day_counter-1] + "</font></td>");
        }
      var day_counter=day_counter + 1;
  }
document.write("</tr>");
for (a=1;a<6;a++)
  {
    document.write("<tr height='"+cell_height+"'>");
    for (b=0;b<7;b++)
      {
        var two_digit_year=new String(the_year);
        var two_digit_year=two_digit_year.slice(2,4);
        var the_date_string = new String(the_month+1) + "/" + new String(day_counter) + "/" + two_digit_year ;
        if (day_counter == the_date_number && the_date.getMonth() == the_month && the_date.getFullYear() == the_year)
          {
        document.write("<td bgcolor='"+todays_cell_color+"' width='"+cell_width+"' align='left' valign='top'><div align='right'><font size='-2' color='"+todays_text_color+"'><b>" + ' ' + day_counter + "</b></font></div><br><font color='"+event_text_color+"' size='-2'>" + c_event[the_month+1][day_counter-1] + "</font></td>");
          }
        else
          {
        document.write("<td bgcolor='"+cell_bg_color+"' width='"+cell_width+"' align='center' valign='top'><div align='right'><font color='"+date_text_color+"' size='-2'><b>" + day_counter + "</b></font></div><br><font color='"+event_text_color+"' size='-2'>" + c_event[the_month+1][day_counter-1] + "</font></td>");
          }
        if (day_counter >= day_in_month)          {
          for (i=b;i<6;i++)            {
document.write("<td bgcolor='"+no_date_cell_color+"' width='"+cell_width+"'> </td>");            }
          var b=7;
          var a=5;
          }
        var day_counter=day_counter + 1;
      }
    document.write("</tr>");
    }
document.write("</table>");
// -->
</script>
Eingabe einer Veranstaltung: Jedes Anführungszeichenpärchen stellt einen Tag in dem betreffendem Monat dar.In dem nachfolgendem Beispiel findet der Laternenlauf am 4.11 statt. Bingo findet also am 8.11 statt usw.

Code: Alles auswählen

  c_event[11] = new Array("","","","Laternenlauf","","","","Bingo<br>19:30 Uhr Schützenhaus","","","","","","","","","","","Skat<br>19:30 Uhr Schützenhaus","","","","","","","","","","","");
Hier die Demoseite: https://hapes-javascript-demo-page.hpag ... nder2.html

Antworten