Изменение фона столбца в зависимости от дня недели
Имеется код:
<html>
<head>
<style type="text/css">
.bgr {
background-color: red;
}
</style>
<script>
</script>
</head>
<body>
<table cols="7">
<tr bgcolor="#EEf0F5" align="center">
<td id="PN">ПН</td>
<td id="VT">ВТ</td>
<td id="SR">CР</td>
<td id="CH">ЧТ</td>
<td id="PT">ПТ</td>
<td id="SB">СБ</td>
<td id="VS">ВС</td>
</tr>
<tr align="center">
<td id="PN">9<sup>00</sup></td>
<td id="VT">9<sup>00</sup></td>
<td id="SR">9<sup>00</sup></td>
<td id="CH">9<sup>00</sup></td>
<td id="PT">9<sup>00</sup></td>
<td id="SB"></td>
<td id="VS"></td>
</tr>
<tr align="center">
<td id="PN">18<sup>00</sup></td>
<td id="VT">18<sup>00</sup></td>
<td id="SR">18<sup>00</sup></td>
<td id="CH">18<sup>00</sup></td>
<td id="PT">18<sup>00</sup></td>
<td id="SB"></td>
<td id="VS"></td>
</tr>
</table>
</body>
</html>
Подскажите, как можно реализовать скрипт, чтобы в зависимости от дня недели применялся стиль .bgr к определённому id, т.е., если сегодня понедельник, то .bgr применяется к группе с id = PN, или может есть иные варианты? |
берёте номер дня (new Date()).getDay() и функцией className меняете классы нужным строкам
|
Не может быть три id="ПН". То есть может, но смысла не может быть.
|
|
Цитата:
|
Цитата:
|
Цитата:
<colgroup>
<col span="2" style="background-color:red">
<col style="background-color:yellow">
</colgroup>
Colgroup задаёт форматирование для каждого столбца, в моём случае он не поможет, т.к. фон должен меняться в зависимости от дня недели, а не оставаться статичным. Пример: ![]() ![]() |
Alban,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script>
var day = (new Date).getDay()||7;
document.write(
'<style>',
'td:nth-of-type('+day+') { background-color: red;}',
'</style>'
)
</script>
</head>
<body>
<table cols="7">
<tr bgcolor="#EEf0F5" align="center">
<td id="PN">ПН</td>
<td id="VT">ВТ</td>
<td id="SR">CР</td>
<td id="CH">ЧТ</td>
<td id="PT">ПТ</td>
<td id="SB">СБ</td>
<td id="VS">ВС</td>
</tr>
<tr align="center">
<td id="PN">9<sup>00</sup></td>
<td id="VT">9<sup>00</sup></td>
<td id="SR">9<sup>00</sup></td>
<td id="CH">9<sup>00</sup></td>
<td id="PT">9<sup>00</sup></td>
<td id="SB"></td>
<td id="VS"></td>
</tr>
<tr align="center">
<td id="PN">18<sup>00</sup></td>
<td id="VT">18<sup>00</sup></td>
<td id="SR">18<sup>00</sup></td>
<td id="CH">18<sup>00</sup></td>
<td id="PT">18<sup>00</sup></td>
<td id="SB"></td>
<td id="VS"></td>
</tr>
</table>
</body>
</html>
|
интересное решение)
|
Цитата:
|
| Часовой пояс GMT +3, время: 03:31. |