Мобильная версия

Электронная библиотека

  • Современные работы
  • Бесплатно скачать книги
  • Бесплатно скачать книги
  • Высшая алгебра, геометрия
  • Математический анализ, ТФ
  • Дифференциальные уравнения
  • Численные методы алгоритмы
  • Математическая физика
  • Теория чисел и множеств
  • Специальные темы, книги
  • Общая высшая физика
  • Другие популярные издания
  • Программисту веб-дизайнеру

  • Документация - HTML, XML
  • Статьи пресс-релизы обзоры
  • Веб-дизайнеру - JavaScript
  • Другие материалы

  • Авторское право - помощь
  • Полиграфия, печать цвет
  • Библиография, статьи
  • Библиотека: скачать готовые скрипты Javascript
    Актуальный календарь с возможностью для клиента выбрать месяц и год

    Посмотрите на работу этого практичного скрипта на отдельной веб-странице (персональный компьютер).
    При помощи приводимого ниже клиентского сценария - скрипта Javascript - можно вставлять всегда актуальный календарь на текущий месяц без указания даты, при помощи Javascript с возможностью для клиента выбрать месяц и год. Цвета и оформление календаря можно редактировать. Возможен перевод календаря на любой язык.

    Выделите мышью приводимый ниже код, скопируйте его (командой Ctrl+C) и вставьте его (командой Ctrl+V) в свою веб-страницу после тэга <body> на нужное Вам место.

    <script language="javascript">
    <!-- Begin
    var dDate = new Date();
    var dCurMonth = dDate.getMonth();
    var dCurDayOfMonth = dDate.getDate();
    var dCurYear = dDate.getFullYear();
    var objprevElement = new Object();

    function fToggleColor(myElement) {
    var toggleColor = "#ff0000";
    if (myElement.id == "calDateText") {
    if (myElement.color == toggleColor) {
    myElement.color = "";
    } else {
    myElement.color = toggleColor;
    }
    } else if (myElement.id == "calCell") {
    for (var i in myElement.children) {
    if (myElement.children[i].id == "calDateText") {
    if (myElement.children[i].color == toggleColor) {
    myElement.children[i].color = "";
    } else {
    myElement.children[i].color = toggleColor;
    }
    }
    }
    }
    }
    function fSetSelectedDay(myElement){
    if (myElement.id == "calCell") {
    if (!isNaN(parseInt(myElement.children["calDateText"].innerText))) {
    myElement.bgColor = "#c0c0c0";
    objprevElement.bgColor = "";
    document.all.calSelectedDate.value = parseInt(myElement.children["calDateText"].innerText);
    objprevElement = myElement;
    }
    }
    }
    function fGetDaysInMonth(iMonth, iYear) {
    var dprevDate = new Date(iYear, iMonth, 0);
    return dprevDate.getDate();
    }
    function fBuildCal(iYear, iMonth, iDayStyle) {
    var aMonth = new Array();
    aMonth[0] = new Array(7);
    aMonth[1] = new Array(7);
    aMonth[2] = new Array(7);
    aMonth[3] = new Array(7);
    aMonth[4] = new Array(7);
    aMonth[5] = new Array(7);
    aMonth[6] = new Array(7);
    var dCalDate = new Date(iYear, iMonth-1, 1);
    var iDayOfFirst = dCalDate.getDay();
    var iDaysInMonth = fGetDaysInMonth(iMonth, iYear);
    var iVarDate = 1;
    var i, d, w;
    if (iDayStyle == 2) {
    aMonth[0][0] = "Воскресенье";
    aMonth[0][1] = "Понедельник";
    aMonth[0][2] = "Вторник";
    aMonth[0][3] = "Среда";
    aMonth[0][4] = "Четверг";
    aMonth[0][5] = "Пятница";
    aMonth[0][6] = "Суббота";
    } else if (iDayStyle == 1) {
    aMonth[0][0] = "Вс";
    aMonth[0][1] = "Пн";
    aMonth[0][2] = "Вт";
    aMonth[0][3] = "Ср";
    aMonth[0][4] = "Чт";
    aMonth[0][5] = "Пт";
    aMonth[0][6] = "Сб";
    } else {
    aMonth[0][0] = "Вс";
    aMonth[0][1] = "Пн";
    aMonth[0][2] = "Вт";
    aMonth[0][3] = "Ср";
    aMonth[0][4] = "Чт";
    aMonth[0][5] = "Пт";
    aMonth[0][6] = "Сб";
    }
    for (d = iDayOfFirst; d < 7; d++) {
    aMonth[1][d] = iVarDate;
    iVarDate++;
    }
    for (w = 2; w < 7; w++) {
    for (d = 0; d < 7; d++) {
    if (iVarDate <= iDaysInMonth) {
    aMonth[w][d] = iVarDate;
    iVarDate++;
    }
    }
    }
    return aMonth;
    }
    function fDrawCal(iYear, iMonth, iCellWidth, iCellHeight, sDateTextSize, sDateTextWeight, iDayStyle) {
    var myMonth;
    myMonth = fBuildCal(iYear, iMonth, iDayStyle);
    document.write("<table border='0'>")
    document.write("<tr>");
    document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][0] + "</td>");
    document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][1] + "</td>");
    document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][2] + "</td>");
    document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][3] + "</td>");
    document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][4] + "</td>");
    document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][5] + "</td>");
    document.write("<td align='center' style='FONT-FAMILY:Arial;FONT-SIZE:12px;FONT-WEIGHT: bold'>" + myMonth[0][6] + "</td>");
    document.write("</tr>");
    for (w = 1; w < 7; w++) {
    document.write("<tr>")
    for (d = 0; d < 7; d++) {
    document.write("<td align='left' valign='top' width='" + iCellWidth + "' height='" + iCellHeight + "' id=calCell style='CURSOR:Hand' onMouseOver='fToggleColor(this)' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)>");
    if (!isNaN(myMonth[w][d])) {
    document.write("<font id=calDateText onMouseOver='fToggleColor(this)' style='CURSOR:Hand;FONT-FAMILY:Arial;FONT-SIZE:" + sDateTextSize + ";FONT-WEIGHT:" + sDateTextWeight + "' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)>" + myMonth[w][d] + "</font>");
    } else {
    document.write("<font id=calDateText onMouseOver='fToggleColor(this)' style='CURSOR:Hand;FONT-FAMILY:Arial;FONT-SIZE:" + sDateTextSize + ";FONT-WEIGHT:" + sDateTextWeight + "' onMouseOut='fToggleColor(this)' onclick=fSetSelectedDay(this)> </font>");
    }
    document.write("</td>")
    }
    document.write("</tr>");
    }
    document.write("</table>")
    }
    function fUpdateCal(iYear, iMonth) {
    myMonth = fBuildCal(iYear, iMonth);
    objprevElement.bgColor = "";
    document.all.calSelectedDate.value = "";
    for (w = 1; w < 7; w++) {
    for (d = 0; d < 7; d++) {
    if (!isNaN(myMonth[w][d])) {
    calDateText[((7*w)+d)-7].innerText = myMonth[w][d];
    } else {
    calDateText[((7*w)+d)-7].innerText = " ";
    }
    }
    }
    }
    // End -->
    </script>





    <script language="javascript" for=window event=onload>
    <!-- Begin
    var dCurDate = new Date();
    frmCalendarSample.tbSelMonth.options[dCurDate.getMonth()].selected = true;
    for (i = 0; i < frmCalendarSample.tbSelYear.length; i++)
    if (frmCalendarSample.tbSelYear.options[i].value == dCurDate.getFullYear())
    frmCalendarSample.tbSelYear.options[i].selected = true;
    // End -->
    </script>

    <form id="frmCalendarSample" method="post" action="">
    <input type="hidden" id="calSelectedDate" value="">

    <table border="0">
    <tr>
    <td>
    <select id="tbSelMonth" onchange='fUpdateCal(frmCalendarSample.tbSelYear.value, frmCalendarSample.tbSelMonth.value)'>
    <option value="1">Январь</option>
    <option value="2">Февраль</option>
    <option value="3">Март</option>
    <option value="4">Апрель</option>
    <option value="5">Май</option>
    <option value="6">Июнь</option>
    <option value="7">Июль</option>
    <option value="8">Август</option>
    <option value="9">Сентябрь</option>
    <option value="10">Октябрь</option>
    <option value="11">Ноябрь</option>
    <option value="12">Декабрь</option>
    </select>

    <select id="tbSelYear" onchange='fUpdateCal(frmCalendarSample.tbSelYear.value, frmCalendarSample.tbSelMonth.value)'>
    <option value="2000">2000</option>
    <option value="2001">2001</option>
    <option value="2002">2002</option>
    <option value="2003">2003</option>
    <option value="2004">2004</option>
    <option value="2005">2005</option>
    <option value="2006">2006</option>
    <option value="2007">2007</option>
    <option value="2008">2008</option>
    <option value="2009">2009</option>
    <option value="2010">2010</option>
    </select>
    </td>
    </tr>
    <tr>
    <td>
    <script language="javascript">
    var dCurDate = new Date();
    fDrawCal(dCurDate.getFullYear(), dCurDate.getMonth()+1, 30, 30, "12px", "bold", 1);
    </script>
    </td>
    </tr>
    </table>
    </form>

    c 15/06/2015 страница посещена
    Counter.CO.KZ

    Мобильная версия

    Сайт для компьютера
    http://www.mat.net.ua