IFRAME Календарик Пример:
Для начала качаем архив
В нём вы найдете два PSD исходника, один для фона другой рамки, так же в нём лежат 19 уже готовых рамок и один фон для календарика, один html файл и один txt файл с названием calendar и ещё один txt файл с кодом для вставки на сайт.
Теперь описание:
Обычно пишут так "создайте html файл", но т.к. он у вас уже есть в архиве, то просто открываем его с помощью блокнота и видим этот код:Code
<html><head>
<title>Наш Календарик</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<script language="JavaScript" title="G1SCRIPT">
<!-- begin
function disableselect(e){
return false;
}
function reEnable(){
return true;
}
document.onselectstart=new Function ("return false");
if (window.sidebar){
document.onmousedown=disableselect;
document.onclick=reEnable;
}
// end -->
</script>
</head>
<body topmargin="0" leftmargin="0" marginheight="0" bgcolor="#000000" background="http://chasikov.net.ru/calendar/games/CS/fonera_cs1.gif">
<table border="0" cellspacing="0" bgcolor="#000000" background="http://chasikov.net.ru/calendar/games/CS/fonera_cs1.gif" width="154" cellpadding="2">
<tr><td width="100%" align="center" valign="middle">
<script language="JavaScript">
<!--//Begin
monthnames = new Array(
"Январь",
"Февраль",
"Март",
"Апрель",
"Май",
"Июнь",
"Июль",
"Август",
"Сентябрь",
"Октябрь",
"Ноябрь",
"Декабрь");
var linkcount=0;
function addlink(month, day, href) {
var entry = new Array(3);
entry[0] = month;
entry[1] = day;
entry[2] = href;
this[linkcount++] = entry;
}
Array.prototype.addlink = addlink;
linkdays = new Array();
monthdays = new Array(12);
monthdays[0]=31;
monthdays[1]=28;
monthdays[2]=31;
monthdays[3]=30;
monthdays[4]=31;
monthdays[5]=30;
monthdays[6]=31;
monthdays[7]=31;
monthdays[8]=30;
monthdays[9]=31;
monthdays[10]=30;
monthdays[11]=31;
todayDate=new Date();
thisday=todayDate.getDay();
thismonth=todayDate.getMonth();
thisdate=todayDate.getDate();
thisyear=todayDate.getYear();
thisyear = thisyear % 100;
thisyear = ((thisyear < 50) ? (2000 + thisyear) : (1900 + thisyear));
if (((thisyear % 4 == 0)
&& !(thisyear % 100 == 0))
||(thisyear % 400 == 0)) monthdays[1]++;
startspaces=thisdate;
while (startspaces > 7) startspaces-=7;
startspaces = thisday - startspaces + 1;
if (startspaces < 0) startspaces+=7;
document.write("<FONT face='verdana'>");<!--Font Face-->
document.write("<table border=0 " );<!--Border size-->
document.write("style='font-size : 12px; color : #FFFFFF; font-weight: bold;???•???:???:???A??' cellpadding=1 cellspacing=2>");<!--Border color, font size, cell padding, cellspacing and font color-->
document.write("<tr><td align=center colspan=7><center>"
+ monthnames[thismonth] + " " + thisyear
+ "</center></td></tr>");
document.write("<tr>");
document.write("<td align=center><font color=#e81d1d>В</td>");<!--Тут меняем цвет воскресенья, а ниже остальные дни-->
document.write("<td align=center><font color=#DDDDDD>П</td>");
document.write("<td align=center><font color=#DDDDDD>В</td>")
document.write("<td align=center><font color=#DDDDDD>С</td>");
document.write("<td align=center><font color=#DDDDDD>Ч</td>");
document.write("<td align=center><font color=#DDDDDD>П</td>");
document.write("<td align=center><font color=#DDDDDD>С</td>");
document.write("</tr>");
document.write("<tr>");
for (s=0;s<startspaces;s++) {
document.write("<td align=center>-</td>");
}
count=1;
while (count <= monthdays[thismonth]) {
for (b = startspaces;b<7;b++) {
linktrue=false;
document.write("<td align=center>");
for (c=0;c<linkdays.length;c++) {
if (linkdays[c] != null) {
if ((linkdays[c][0]==thismonth + 1) && (linkdays[c][1]==count)) {
document.write("<a href=\"" + linkdays[c][2] + "\">");
linktrue=true;
}
}
}
if (count==thisdate) {
document.write("<span style='background-color: rgb(0,0,0);border: 1px solid #e81d1d'><font color='#DDDDDD'>");<!--тут цвет цифры и рамки сегодняшнего дня-->
}
if (count <= monthdays[thismonth]) {
document.write(count);
}
else {
document.write(" ");
}
if (count==thisdate) {
document.write("</font>");
}
if (linktrue)
document.write("</a>");
document.write("</td>");
count++;
}
document.write("</tr>");
document.write("<tr>");
startspaces=0;
}
document.write("</table>");
document.write("</FONT>");
</script></td></tr>
</tr>
</table>
<div id="Layer1"
style="position:absolute; left:0px; top:0px; width:164px; height:174px; z-index:2">
<img src="http://chasikov.net.ru/calendar/games/CS/rama_cs.gif" width="164" height="174" border="0"></a></div>
</body>
</html>
Внимательно расмотрев код находим вот такие ссылки:
http://chasikov.net.ru/calendar/games/CS/fonera_cs1.gif - ссылка, путь к фону календарика их две в коде
http://chasikov.net.ru/calendar/games/CS/rama_cs.gif - ссылка, путь к рамке календарика
изменяем их на свои. В самом коде есть подсказки. где менять цвета цифр и букв.
Так дальше вы должны загрузить свой календарик файл calendar.html к себе на сайт, и указать путь календаря в следущем коде:Code
<IFRAME name="Calendar" src="http://chasikov.net.ru/preview/calendar.html" width=164 height=174 scrolling="no" frameborder="0"></IFRAME>
заменив в коде ссылку:
http://chasikov.net.ru/preview/calendar.html - путь к календарику
и этот же что выше код IFRAME используйте для вставки себе на сайт.
Есть ещё один момент, если у вас сайт в системе ucoz, то при загрузке на сайт вашего календарика файл calendar.html, могут возникнуть ошибки в кодировке заместо текста в кириллице будут квадратики �����, то исправляем эту ошибку просто редактируем в файловом менеджере на своём сайте "изменяем содержимое файла" открыв окно, меняем содержимое на то что вы сделали ранее, открыв свой файл calendar.html с помощью блокнота, и сохраняем. Всё
Добавить эту страницу в закладки: