<style type="text/css">
div { border: 1px solid #999;
padding: 5px;
margin: 0 0 5px; }
table { border: 1px solid #00f;
padding: 5px; }
td { border: 1px solid #090;
padding: 5px; }
#navigation_panel {
white-space: nowrap;
overflow: scroll;
padding: 5px;
min-width: 400px; }
select { background-color: hsl(210, 100%, 90%);
color: hsl(210, 100%, 50%);
border: 1px solid hsl(210, 100%, 50%);
font: bold 14px serif;
padding: 5px; }
button { background-color: hsl(210, 100%, 90%);
color: hsl(210, 100%, 50%);
border: 1px solid hsl(210, 100%, 50%);
font: 14px serif;
width: 30px;
height:30px;
border-radius: 12px 12px 0 12px; }
button.month_minus,
button.year_minus,
button.kvartal_minus,
button.year_05_minus
{ background-color: hsl(210, 100%, 90%);
color: hsl(210, 100%, 50%);
border: 1px solid hsl(210, 100%, 50%);
font: 14px serif;
width: 30px;
height:30px;
border-radius: 28px 0 0 28px/18px 0 0 18px; }
button.month_plus,
button.year_plus,
button.kvartal_plus,
button.year_05_plus
{ background-color: hsl(210, 100%, 90%);
color: hsl(210, 100%, 50%);
border: 1px solid hsl(210, 100%, 50%);
font: 14px serif;
width: 30px;
height:30px;
border-radius: 0 28px 28px 0/0 18px 18px 0; }
input { border: 1px solid #099;
width: 60px; }
span { background-color: hsl(190, 100%, 98%);
color: hsl(190, 100%, 40%);
border: 1px solid hsl(190, 100%, 40%);
font: 14px serif;
padding: 5px;
display: inline-block;
}
</style>
<body>
<div id="calendar_month">
<div id="month">
<div id="navigation_panel">
Календарь на месяц<br>
<button class="month_minus">◀</button>
<select class="select_month">
<option value="01">Январь</option>
<option value="02">Февраль</option>
<option value="03">Март</option>
<option value="04">Апрель</option>
<option value="05">Май</option>
<option value="06">Июнь</option>
<option value="07">Июль</option>
<option value="08">Август</option>
<option value="09">Сентябрь</option>
<option value="10">Октябрь</option>
<option value="11">Ноябрь</option>
<option value="12">Декабрь</option>
</select>
<button class="month_plus">▶</button>
<button class="year_minus">◀</button>
<input class="year_input" type="number" value="">
<button class="year_plus">▶</button>
<button class="table_rotate">➘</button>
</div>
<div id="month_name"></div>
<table class=" table_month_horiz"></table>
</div>
<span id="select_3_month">календарь на 3 месяца</span>
</div>
<div id="month_3">
<div id="navigation_panel">
Календарь на 3 месяца<br>
<button class="month_minus">◀</button>
<select class="select_month">
<option value="01">Январь</option>
<option value="02">Февраль</option>
<option value="03">Март</option>
<option value="04">Апрель</option>
<option value="05">Май</option>
<option value="06">Июнь</option>
<option value="07">Июль</option>
<option value="08">Август</option>
<option value="09">Сентябрь</option>
<option value="10">Октябрь</option>
<option value="11">Ноябрь</option>
<option value="12">Декабрь</option>
</select>
<button class="month_plus">▶</button>
<button class="year_minus">◀</button>
<input class="year_input" type="number" value="">
<button class="year_plus">▶</button>
<button class="table_rotate">➘</button>
</div>
<div id="month_minis_11">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_10">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_9">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_8">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_7">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_6">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_5">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_4">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_3">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_2">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_minis_1">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_cur">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_1">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_2">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_3">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_4">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_5">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_6">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_7">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_8">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_9">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_10">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<div id="month_plus_11">
<div class="month_year"></div>
<table class="table_month_horiz"></table>
</div>
<span id="select_month">календарь на месяц</span>
</div>
</body>
вот несколько body, как правильно вставить таблицы календаря? чтобы скрипт работал независимо от наличия или отсутствия вертикальной или горизонтальной таблицы, спанов "календарь на месяц/год", кнопок +/-, "сегодня" ?
другими словами, помогите сделать универсальный скрипт, один для всех этих страниц, если надо вертикальный или горизонтальный календарь, или с переключением направления таблицы, календарь на месяц или год, квартал, полугодие, три(несколько) месяцев, с переключением отображения месяц/год, или без переключения,
кто может помочь?