Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.03.2018, 18:35
Новичок на форуме
Отправить личное сообщение для leonid6723 Посмотреть профиль Найти все сообщения от leonid6723
 
Регистрация: 22.03.2018
Сообщений: 1

Воссоздать календарь 2018г
Добрый вечер Уважаемые пользователи форума,помогите сделать в календари отступы,чтоб был как март месяц 2018 года+хотелось бы как то выделить сегодняшнюю дату
вот код
<html>
<head>
<title>test89</title>
<table id="table" border=5 name="table">
<tr>
<th class="header" colspan=7></th>
</tr>
<tr class="big">
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>

<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td>
</tr>
</table>
</head>
<body onload="displayCalendar()">
<script>
function displayCalendar(){
var htmlContent ="";
var counter = 1;
var dateNow = new Date();
var month = dateNow.getMonth();
var nextMonth = month +1; //+1; //Used to match up the current month with the correct start date.
var prevMonth = month -1;
var day = dateNow.getDate();
var year = dateNow.getFullYear();
//имена месяцев и дни недель
var monthNames = ["Январь","Февраль","Март","Апр ель","Май","Июнь","Июль","Авгус т","Сентябрь","Октябрь","Нояб ь", "Декабрь"];
var dayNames = ["Пн","Вт","Ср","Чт","Пт","Сб", "Вс"];
var dayPerMonth = ["31", "28","31","30","31","30","31","31","30","31","30", "31"];
var nextDate = new Date(nextMonth +' 1 ,'+year);
var numOfDays = dayPerMonth[month];
var weekdays= nextDate.getDay();
var weekdays2 = weekdays;


//построение таблицы
var tbl=document.getElementsByClassName("header")[0].innerHTML=monthNames[month]+" "+year;
var tbl=document.getElementById('table');
for (i=0; i<7; i++) {
tbl.rows[1].cells[i].innerHTML=dayNames[i];
}
for ( i=0;i<=6;i++){
for (j=0; j<7; j++) {
tbl.rows[i+2].cells[j].innerHTML = counter;
counter++;
}
}



}
</script>
<div id="calendar"></div>
<style>
.dayNow{
border: 2px solid black;
color:Red;
text-align: center;
}
</style>
</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 23.03.2018, 11:58
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

<html>
<head>
<title>test89</title>
<table id="table" border=5 name="table">
<tr>
<th class="header" colspan=7></th>
</tr>
<tr class="big">
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
<tr>
<td></td><td></td><td></td><td></td><td></td><td></td><td></td>
</tr>
</table>
</head>
<body onload="displayCalendar()">
<script>
function displayCalendar(){
var today = new Date();
var dateOther = new Date();
var dateMont = new Date(today.getFullYear(),today.getMonth(),1);

var month = dateMont.getMonth();
var day = dateMont.getDay();
var year = dateMont.getFullYear();
//имена месяцев и дни недель 
var monthNames = ["Январь","Февраль","Март","Апрель","Май","Июнь","Июль","Авгус т","Сентябрь","Октябрь","Ноябрь", "Декабрь"];
var dayNames = ["Пн","Вт","Ср","Чт","Пт","Сб", "Вс"];


//построение таблицы
var tbl=document.getElementsByClassName("header")[0].innerHTML=monthNames[month]+" "+year;
var tbl=document.getElementById('table');
for (i=0; i<7; i++) {
tbl.rows[1].cells[i].innerHTML=dayNames[i];
}
for ( i=0; i<6; i++){
   if(i == 5 && dateMont.getMonth() != month) {
      table.deleteRow(tbl.rows[i+2]);
      i++;
   } else {
      for (j=0; j<7; j++) {
         var k = j<6? j + 1 : 0;
         var n = dateMont.getDay() == 0? 7: dateMont.getDay();
         if(dateMont.getDay() == k && dateMont.getMonth() == month) {
            tbl.rows[i+2].cells[j].innerHTML = dateMont.getDate(); 
            if(today.getDate() == dateMont.getDate()) tbl.rows[i+2].cells[j].style.backgroundColor = 'lightgreen';
            dateMont.setDate(dateMont.getDate() + 1);
          } else {
            if(i == 0) {
               dateOther = new Date();
               dateOther.setDate(dateMont.getDate() - (n - k)); 
               tbl.rows[i+2].cells[j].innerHTML =  dateOther.getDate(); 
               tbl.rows[i+2].cells[j].style.color = 'gray';
            } else {
               dateOther = new Date();
               dateOther.setDate(dateMont.getDate());
               tbl.rows[i+2].cells[j].innerHTML =  dateOther.getDate(); 
               tbl.rows[i+2].cells[j].style.color = 'gray';
               dateMont.setDate(dateMont.getDate() + 1);
            }
         }
      }
   }
}



}
</script>
<div id="calendar"></div> 
<style> 
.dayNow{
border: 2px solid black;
color:Red;
text-align: center;
}
</style> 
</body>
</html>

Последний раз редактировалось Dilettante_Pro, 02.04.2018 в 10:29.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не открывается календарь datapicker в ячейках таблицы kupidon Общие вопросы Javascript 13 24.02.2017 20:08
Календарь DatePicker TanyaRom jQuery 4 14.10.2015 10:32
Freelance. Нужен календарь на Javascript для подстановки в <input /> даты и времени. DiYanka Работа 1 14.06.2014 02:03
Нужен календарь. m~r.Nemo Работа 4 19.08.2013 19:03
jQuery UI календарь в далоговом окне ololosh jQuery 1 14.08.2012 17:23