08.08.2010 19:36:45
Доп-меню Хамелион Версия 2
Всем здраствуйте. Мы решили выложить в паблик оригинальное доп-меню. Чем же оно оригинально? Тем что на каждом дизайне менять можно и само меню! Вплоть до шрифтов картинок итд. Помечу что это оригинальное доп-меню посвящается Майт Мили от .Lary. Итак приступим к инструкции. Первое это скрины.
1-дизайн.
2-дизайн.
3-дизайн.
Итак для каждого дизайна можно делать свою картинку, цвет шрифта, размер итд.
Инструкция.
<script type="text/javascript" src="/js/smiles.jsa"></script>
<script type="text/javascript" src="http://infiniti1985.ucoz.ru/desire/menu/setup.js"></script>
<script type="text/javascript" src="http://infiniti1985.ucoz.ru/desire/menu/design.js"></script>
%TABLE<<<END
<div id=title align=center style="padding-top: 15px; padding-bottom: 7px;"><b>СЕЙЧАС В ЧАТЕ: %TOTAL%</b></div>
<table class=list cellspacing=1 cellpadding=1 width=100%>
{{{
<tr><td colspan=4>%CAPTION%</td></tr>
{{{
<tr>
<th width=1% height="21" nowrap>%ICON%</th><td width=1% nowrap>%STAT_ICON%</td>
<td width=1% nowrap>%SMALL_FLAG%</td>
<td width=1% nowrap>%NICK%%TORT%%? %INVISIBLE%?%%? %USER_STAT%?%</td>
</tr>
}}}
}}}
</table>
END%
<!-- <div align=center id=title>СЕЙЧАС В ЧАТЕ</div> -->
%CHAT("WHO", %TABLE%, "<div class=tm>почти никого нет</div>",
[1, "<div class=bm>~Мальчики~</div>", 2, "<div class=gm>~Девочки~</div>", 0, "<div class=nm>~Инкогнито~</div>", 3, "<div class=vm>на голосовании</div>"],
"анкета %%NICK%%",
""
)%
<table id="chamaelon_body" border="0" width="100%" onclick="slide_down()">
<tr id="reserv">
<td><img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="7px" onload="cross()" /></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/people/birthday"target="_blank" class="chamaelon_point">Дни рождения</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/people/top"target="_blank" class="chamaelon_point">ТОП 10</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/help"target="_blank" class="chamaelon_point">Помощь</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/creation/?"target="_blank"" class="chamaelon_point">Творчество</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/"target="_blank"" class="chamaelon_point">Форум чата</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/page/1"target="_blank"" class="chamaelon_point">Звания</a></td>
</tr>
<tr>
<td align="center"><a href="http://august4u.net/"target="_blank"" class="chamaelon_point">Создать чат</a></td>
</tr>
<tr>
<td><center>ICQ администрации:
<br><img src="http://infiniti1985.ucoz.ru/desire/menu/img/icq.gif" alt="icq">557-559<br></center> </td>
</tr>
<tr>
<th id="chamaelon_head"><img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" onload="cross()" height="15px" width="1px" /><a href="#"'>..::Дополнительное меню::..</a></th>
</tr>
</table>
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css6()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css5()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css4()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css3()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css2()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css1()" />
<script src=js/country_ru.js></script>
<SCRIPT language=JavaScript>
document.ondragstart = InfinitI;
document.onselectstart = InfinitI;
document.oncontextmenu = InfinitI;
function InfinitI() {
return false
}
</SCRIPT>
<script type="text/javascript" src="http://infiniti1985.ucoz.ru/desire/menu/setup.js"></script>
<script type="text/javascript" src="http://infiniti1985.ucoz.ru/desire/menu/design.js"></script>
%TABLE<<<END
<div id=title align=center style="padding-top: 15px; padding-bottom: 7px;"><b>СЕЙЧАС В ЧАТЕ: %TOTAL%</b></div>
<table class=list cellspacing=1 cellpadding=1 width=100%>
{{{
<tr><td colspan=4>%CAPTION%</td></tr>
{{{
<tr>
<th width=1% height="21" nowrap>%ICON%</th><td width=1% nowrap>%STAT_ICON%</td>
<td width=1% nowrap>%SMALL_FLAG%</td>
<td width=1% nowrap>%NICK%%TORT%%? %INVISIBLE%?%%? %USER_STAT%?%</td>
</tr>
}}}
}}}
</table>
END%
<!-- <div align=center id=title>СЕЙЧАС В ЧАТЕ</div> -->
%CHAT("WHO", %TABLE%, "<div class=tm>почти никого нет</div>",
[1, "<div class=bm>~Мальчики~</div>", 2, "<div class=gm>~Девочки~</div>", 0, "<div class=nm>~Инкогнито~</div>", 3, "<div class=vm>на голосовании</div>"],
"анкета %%NICK%%",
""
)%
<table id="chamaelon_body" border="0" width="100%" onclick="slide_down()">
<tr id="reserv">
<td><img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="7px" onload="cross()" /></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/people/birthday"target="_blank" class="chamaelon_point">Дни рождения</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/people/top"target="_blank" class="chamaelon_point">ТОП 10</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/help"target="_blank" class="chamaelon_point">Помощь</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/creation/?"target="_blank"" class="chamaelon_point">Творчество</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/"target="_blank"" class="chamaelon_point">Форум чата</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/page/1"target="_blank"" class="chamaelon_point">Звания</a></td>
</tr>
<tr>
<td align="center"><a href="http://august4u.net/"target="_blank"" class="chamaelon_point">Создать чат</a></td>
</tr>
<tr>
<td><center>ICQ администрации:
<br><img src="http://infiniti1985.ucoz.ru/desire/menu/img/icq.gif" alt="icq">557-559<br></center> </td>
</tr>
<tr>
<th id="chamaelon_head"><img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" onload="cross()" height="15px" width="1px" /><a href="#"'>..::Дополнительное меню::..</a></th>
</tr>
</table>
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css6()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css5()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css4()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css3()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css2()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css1()" />
<script src=js/country_ru.js></script>
<SCRIPT language=JavaScript>
document.ondragstart = InfinitI;
document.onselectstart = InfinitI;
document.oncontextmenu = InfinitI;
function InfinitI() {
return false
}
</SCRIPT>
Естественно сами шаблоны "Кто в чате" брались из отдельного чата. Вы уже ставите свои шаблоны. Итак начнём разберать по пункту.
1. Setup.
<script type="text/javascript" src="http://infiniti1985.ucoz.ru/desire/menu/setup.js"></script>
Сам скрипт. Его оставляем без измений. Создаём фаил js и кидаем себе на хост. На тот же самый юкоз или любой другой.
// Меню «Хамелеон»
// Версия 2
// Копирайт © лаборатория «проМили»
// Посвящается Майт Мили
// Авторы: Лайт Лари, InfinitI
// Авторы не несут ответсвенности и не дают гарантий связанных с данным скриптом
// Скрипт распространяется согласно условиям ГНУ ГПЛ версии 3 и выше (http://www.gnu.org/licenses/)
var message="";
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2) {
(message);
return false;}}}
if (document.layers) {
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS;
}else{
document.onmouseup=clickNS;
document.oncontextmenu=clickIE;
}
document.oncontextmenu=new Function("return false")
// Версия 2
// Копирайт © лаборатория «проМили»
// Посвящается Майт Мили
// Авторы: Лайт Лари, InfinitI
// Авторы не несут ответсвенности и не дают гарантий связанных с данным скриптом
// Скрипт распространяется согласно условиям ГНУ ГПЛ версии 3 и выше (http://www.gnu.org/licenses/)
var message="";
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2) {
(message);
return false;}}}
if (document.layers) {
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS;
}else{
document.onmouseup=clickNS;
document.oncontextmenu=clickIE;
}
document.oncontextmenu=new Function("return false")
2. Design.
<script type="text/javascript" src="http://infiniti1985.ucoz.ru/desire/menu/design.js"></script>
Тут уже будем расматривать по под-пунктам.
Сам скрипт.
// Меню «Хамелеон»
// Версия 2
// Копирайт © лаборатория «проМили»
// Посвящается Майт Мили
// Авторы: Лайт Лари, InfinitI
// Авторы не несут ответсвенности и не дают гарантий связанных с данным скриптом
// Скрипт распространяется согласно условиям ГНУ ГПЛ версии 3 и выше (http://www.gnu.org/licenses/)
function parse_css6()
{
var css_for_chamaelon6 = document.createElement('link');
css_for_chamaelon6.id = 'chamaelon6';
css_for_chamaelon6.type = 'text/css';
css_for_chamaelon6.rel = 'stylesheet';
css_for_chamaelon6.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
var css_head = document.getElementById('css_d5_2').parentNode;
css_head.appendChild(css_for_chamaelon6);
return;
}
function parse_css5()
{
var css_for_chamaelon5 = document.createElement('link');
css_for_chamaelon5.id = 'chamaelon5';
css_for_chamaelon5.type = 'text/css';
css_for_chamaelon5.rel = 'stylesheet';
css_for_chamaelon5.href = 'http://infiniti1985.ucoz.ru/desire/menu/d4.css';
var css_head = document.getElementById('css_d4_2').parentNode;
css_head.appendChild(css_for_chamaelon5);
return;
}
function parse_css4()
{
var css_for_chamaelon4 = document.createElement('link');
css_for_chamaelon4.id = 'chamaelon4';
css_for_chamaelon4.type = 'text/css';
css_for_chamaelon4.rel = 'stylesheet';
css_for_chamaelon4.href = 'http://infiniti1985.ucoz.ru/desire/menu/d3.css';
var css_head = document.getElementById('css_d3_2').parentNode;
css_head.appendChild(css_for_chamaelon4);
return;
}
function parse_css3()
{
var css_for_chamaelon3 = document.createElement('link');
css_for_chamaelon3.id = 'chamaelon3';
css_for_chamaelon3.type = 'text/css';
css_for_chamaelon3.rel = 'stylesheet';
css_for_chamaelon3.href = 'http://infiniti1985.ucoz.ru/desire/menu/d2.css';
var css_head = document.getElementById('css_d2_2').parentNode;
css_head.appendChild(css_for_chamaelon3);
return;
}
function parse_css2()
{
var css_for_chamaelon2 = document.createElement('link');
css_for_chamaelon2.id = 'chamaelon2';
css_for_chamaelon2.type = 'text/css';
css_for_chamaelon2.rel = 'stylesheet';
css_for_chamaelon2.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
var css_head = document.getElementById('css_d1_2').parentNode;
css_head.appendChild(css_for_chamaelon2);
return;
}
function parse_css1()
{
var css_for_chamaelon1 = document.createElement('link');
css_for_chamaelon1.id = 'chamaelon1';
css_for_chamaelon1.type = 'text/css';
css_for_chamaelon1.rel = 'stylesheet';
css_for_chamaelon1.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
var css_head = document.getElementById('css_d0_2').parentNode;
css_head.appendChild(css_for_chamaelon1);
return;
}
function cross()
{
var browser=navigator.appName;
if (browser!="Opera")
{
document.getElementById('reserv').style.display='none';
}
}
var i=-200;
var int_up;
var int_down;
var c=0;
function slide_down()
{
if (c==0)
{
c=1;
clearInterval(int_up);
int_down=setInterval("down()",10);
}
else
{
c=0;
clearInterval(int_down);
int_up=setInterval("up()",10);
}
}
function down()
{
if (i<-104)
{
i=i+3;
document.getElementById('chamaelon_body').style.top=i;
}
else if (i<-1)
{
i=i+1;
document.getElementById('chamaelon_body').style.top=i;
}
}
function up()
{
if (i>-200)
{
i=i-5;
document.getElementById('chamaelon_body').style.top=i;
}
}
// Версия 2
// Копирайт © лаборатория «проМили»
// Посвящается Майт Мили
// Авторы: Лайт Лари, InfinitI
// Авторы не несут ответсвенности и не дают гарантий связанных с данным скриптом
// Скрипт распространяется согласно условиям ГНУ ГПЛ версии 3 и выше (http://www.gnu.org/licenses/)
function parse_css6()
{
var css_for_chamaelon6 = document.createElement('link');
css_for_chamaelon6.id = 'chamaelon6';
css_for_chamaelon6.type = 'text/css';
css_for_chamaelon6.rel = 'stylesheet';
css_for_chamaelon6.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
var css_head = document.getElementById('css_d5_2').parentNode;
css_head.appendChild(css_for_chamaelon6);
return;
}
function parse_css5()
{
var css_for_chamaelon5 = document.createElement('link');
css_for_chamaelon5.id = 'chamaelon5';
css_for_chamaelon5.type = 'text/css';
css_for_chamaelon5.rel = 'stylesheet';
css_for_chamaelon5.href = 'http://infiniti1985.ucoz.ru/desire/menu/d4.css';
var css_head = document.getElementById('css_d4_2').parentNode;
css_head.appendChild(css_for_chamaelon5);
return;
}
function parse_css4()
{
var css_for_chamaelon4 = document.createElement('link');
css_for_chamaelon4.id = 'chamaelon4';
css_for_chamaelon4.type = 'text/css';
css_for_chamaelon4.rel = 'stylesheet';
css_for_chamaelon4.href = 'http://infiniti1985.ucoz.ru/desire/menu/d3.css';
var css_head = document.getElementById('css_d3_2').parentNode;
css_head.appendChild(css_for_chamaelon4);
return;
}
function parse_css3()
{
var css_for_chamaelon3 = document.createElement('link');
css_for_chamaelon3.id = 'chamaelon3';
css_for_chamaelon3.type = 'text/css';
css_for_chamaelon3.rel = 'stylesheet';
css_for_chamaelon3.href = 'http://infiniti1985.ucoz.ru/desire/menu/d2.css';
var css_head = document.getElementById('css_d2_2').parentNode;
css_head.appendChild(css_for_chamaelon3);
return;
}
function parse_css2()
{
var css_for_chamaelon2 = document.createElement('link');
css_for_chamaelon2.id = 'chamaelon2';
css_for_chamaelon2.type = 'text/css';
css_for_chamaelon2.rel = 'stylesheet';
css_for_chamaelon2.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
var css_head = document.getElementById('css_d1_2').parentNode;
css_head.appendChild(css_for_chamaelon2);
return;
}
function parse_css1()
{
var css_for_chamaelon1 = document.createElement('link');
css_for_chamaelon1.id = 'chamaelon1';
css_for_chamaelon1.type = 'text/css';
css_for_chamaelon1.rel = 'stylesheet';
css_for_chamaelon1.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
var css_head = document.getElementById('css_d0_2').parentNode;
css_head.appendChild(css_for_chamaelon1);
return;
}
function cross()
{
var browser=navigator.appName;
if (browser!="Opera")
{
document.getElementById('reserv').style.display='none';
}
}
var i=-200;
var int_up;
var int_down;
var c=0;
function slide_down()
{
if (c==0)
{
c=1;
clearInterval(int_up);
int_down=setInterval("down()",10);
}
else
{
c=0;
clearInterval(int_down);
int_up=setInterval("up()",10);
}
}
function down()
{
if (i<-104)
{
i=i+3;
document.getElementById('chamaelon_body').style.top=i;
}
else if (i<-1)
{
i=i+1;
document.getElementById('chamaelon_body').style.top=i;
}
}
function up()
{
if (i>-200)
{
i=i-5;
document.getElementById('chamaelon_body').style.top=i;
}
}
2.1.Начнём разбирать составную чать.
function parse_css1()
{
var css_for_chamaelon1 = document.createElement('link');
css_for_chamaelon1.id = 'chamaelon1';
css_for_chamaelon1.type = 'text/css';
css_for_chamaelon1.rel = 'stylesheet';
css_for_chamaelon1.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
var css_head = document.getElementById('css_d0_2').parentNode;
css_head.appendChild(css_for_chamaelon1);
return;
}
{
var css_for_chamaelon1 = document.createElement('link');
css_for_chamaelon1.id = 'chamaelon1';
css_for_chamaelon1.type = 'text/css';
css_for_chamaelon1.rel = 'stylesheet';
css_for_chamaelon1.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
var css_head = document.getElementById('css_d0_2').parentNode;
css_head.appendChild(css_for_chamaelon1);
return;
}
Буду немного проще. Номер ставим везде один по айди, chamaelon1. Везде ставим 1 , кроме.
var css_head = document.getElementById('css_d0_2').parentNode;
css_d0_2 - тут 0 это ID самого дизайна в чате. Тоесть ставим айди на тот дизайн к которому будем менять интерфейс.
Далее.
css_for_chamaelon1.href = 'http://infiniti1985.ucoz.ru/desire/menu/d1.css';
http://infiniti1985.ucoz.ru/desire/menu/d1.css - это css к каждому дизайну естественно разный. Начнём расматривать.
2.2. Css.
Итак допустим - http://infiniti1985.ucoz.ru/desire/menu/d1.css
Смотрим сам стаил.
/*
Копирование и распространение бессмысленно
Для дизайна "Blue Techno"
*/
#chamaelon_body
{
background-image:url('img/blue.gif');
background-repeat:no-repeat;
background-color:#000000;
color:#FFFFFF;
font-size:13px;
font-weight: bold;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
position:absolute;
top:-205px;
left:0px;
}
#chamaelon_head
{
background-image:url('img/blue_m.gif');
background-repeat:repeat-x;
color:#FFFFFF;
font-weight:100;
padding-top:0px;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}
a.chamaelon_point
{
text-decoration:none;
}
a.chamaelon_point:link
{
color:#CCCCCC;
margin-left:0px;
}
a.chamaelon_point:visited
{
color:#CCCCCC;
margin-left:0px;
}
a.chamaelon_point:hover
{
color:#FFFFFF;
margin-left:0px;
text-decoration: underline;
}
a {
color: #03F;
border-width: 0px;
}
a:link {
text-decoration: none;
color: #03F;
}
a:visited {
text-decoration: none;
color: #03F;
}
a:hover {
text-decoration: blink;
color: #C60;
}
a:active {
text-decoration: none;
color: #C60;
}
Копирование и распространение бессмысленно
Для дизайна "Blue Techno"
*/
#chamaelon_body
{
background-image:url('img/blue.gif');
background-repeat:no-repeat;
background-color:#000000;
color:#FFFFFF;
font-size:13px;
font-weight: bold;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
position:absolute;
top:-205px;
left:0px;
}
#chamaelon_head
{
background-image:url('img/blue_m.gif');
background-repeat:repeat-x;
color:#FFFFFF;
font-weight:100;
padding-top:0px;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}
a.chamaelon_point
{
text-decoration:none;
}
a.chamaelon_point:link
{
color:#CCCCCC;
margin-left:0px;
}
a.chamaelon_point:visited
{
color:#CCCCCC;
margin-left:0px;
}
a.chamaelon_point:hover
{
color:#FFFFFF;
margin-left:0px;
text-decoration: underline;
}
a {
color: #03F;
border-width: 0px;
}
a:link {
text-decoration: none;
color: #03F;
}
a:visited {
text-decoration: none;
color: #03F;
}
a:hover {
text-decoration: blink;
color: #C60;
}
a:active {
text-decoration: none;
color: #C60;
}
2.2.1. Итак рассмотрим.
#chamaelon_body
{
background-image:url('img/blue.gif');
background-repeat:no-repeat;
background-color:#000000;
color:#FFFFFF;
font-size:13px;
font-weight: bold;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
position:absolute;
top:-205px;
left:0px;
}
{
background-image:url('img/blue.gif');
background-repeat:no-repeat;
background-color:#000000;
color:#FFFFFF;
font-size:13px;
font-weight: bold;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
position:absolute;
top:-205px;
left:0px;
}
background-image:url('img/blue.gif'); - img/blue.gif - это сама картинка на меню дизайна. У меня она такая, http://infiniti1985.ucoz.ru/desire/menu/img/blue.gif
У вас естественно своя. Можно просто поставить сылку на радикал и др. хосты.
Далее.
color:#FFFFFF;
font-size:13px;
font-weight: bold;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
font-size:13px;
font-weight: bold;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
Тут ставим шрифт, цвет, размер шрифта.
Далее.
top:-205px; - это высота меню. Тоесть поидее самой картинки.
2.2.2. Далее.
#chamaelon_head
{
background-image:url('img/blue_m.gif');
background-repeat:repeat-x;
color:#FFFFFF;
font-weight:100;
padding-top:0px;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}
{
background-image:url('img/blue_m.gif');
background-repeat:repeat-x;
color:#FFFFFF;
font-weight:100;
padding-top:0px;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}
background-image:url('img/blue_m.gif'); - это картинка названия доп-меню (резиновая). У меня она такая - http://infiniti1985.ucoz.ru/desire/menu/img/blue_m.gif
color:#FFFFFF;
font-weight:100;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
font-weight:100;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
Это цвет, шрифт.
2.2.3. Далее.
a.chamaelon_point
{
text-decoration:none;
}
a.chamaelon_point:link
{
color:#CCCCCC;
margin-left:0px;
}
a.chamaelon_point:visited
{
color:#CCCCCC;
margin-left:0px;
}
a.chamaelon_point:hover
{
color:#FFFFFF;
margin-left:0px;
text-decoration: underline;
}
{
text-decoration:none;
}
a.chamaelon_point:link
{
color:#CCCCCC;
margin-left:0px;
}
a.chamaelon_point:visited
{
color:#CCCCCC;
margin-left:0px;
}
a.chamaelon_point:hover
{
color:#FFFFFF;
margin-left:0px;
text-decoration: underline;
}
Это функци связанные с сылками в доп-меню. Цвет, декорация итд активнойи неактивной кнопки.
2.2.4. Далее.
a {
color: #03F;
border-width: 0px;
}
a:link {
text-decoration: none;
color: #03F;
}
a:visited {
text-decoration: none;
color: #03F;
}
a:hover {
text-decoration: blink;
color: #C60;
}
a:active {
text-decoration: none;
color: #C60;
}
color: #03F;
border-width: 0px;
}
a:link {
text-decoration: none;
color: #03F;
}
a:visited {
text-decoration: none;
color: #03F;
}
a:hover {
text-decoration: blink;
color: #C60;
}
a:active {
text-decoration: none;
color: #C60;
}
Эти функции идут на саму кнопку "..::Дополнительное меню::..". Цвет, декорация итд активнойи неактивной кнопки.
2.3. Сделали для первого дизайна далее делаем для второго.
function parse_css3()
{
var css_for_chamaelon3 = document.createElement('link');
css_for_chamaelon3.id = 'chamaelon3';
css_for_chamaelon3.type = 'text/css';
css_for_chamaelon3.rel = 'stylesheet';
css_for_chamaelon3.href = 'http://infiniti1985.ucoz.ru/desire/menu/d2.css';
var css_head = document.getElementById('css_d2_2').parentNode;
css_head.appendChild(css_for_chamaelon3);
return;
}
{
var css_for_chamaelon3 = document.createElement('link');
css_for_chamaelon3.id = 'chamaelon3';
css_for_chamaelon3.type = 'text/css';
css_for_chamaelon3.rel = 'stylesheet';
css_for_chamaelon3.href = 'http://infiniti1985.ucoz.ru/desire/menu/d2.css';
var css_head = document.getElementById('css_d2_2').parentNode;
css_head.appendChild(css_for_chamaelon3);
return;
}
Тут так же меняем цифры на айди функции скрипта, и в css_d1_2 , d1, ставим номер айди самого дизайна в чате. Опять же создаём свой css у меня он - http://infiniti1985.ucoz.ru/desire/menu/d2.css
Далее рисуем две картинки само доп-меню и резинку на кнопку доп-меню. Далее смотрим пример написанный мною выше.
И так делаем для каждого дизайна.
Далее смотрим сюда.
var i=-200;
var int_up;
var int_down;
var c=0;
var int_up;
var int_down;
var c=0;
function up()
{
if (i>-200)
{
{
if (i>-200)
{
Это высота , меняем на свою.
Итак после того как закончили с этим. Сохраняем файлы сам js и css файлы для разных дизайнов. Грузим всё на хост.
2.4 Сама табличка доп-меню.
<table id="chamaelon_body" border="0" width="100%" onclick="slide_down()">
<tr id="reserv">
<td><img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="7px" onload="cross()" /></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/people/birthday"target="_blank" class="chamaelon_point">Дни рождения</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/people/top"target="_blank" class="chamaelon_point">ТОП 10</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/help"target="_blank" class="chamaelon_point">Помощь</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/creation/?"target="_blank"" class="chamaelon_point">Творчество</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/"target="_blank"" class="chamaelon_point">Форум чата</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/page/1"target="_blank"" class="chamaelon_point">Звания</a></td>
</tr>
<tr>
<td align="center"><a href="http://august4u.net/"target="_blank"" class="chamaelon_point">Создать чат</a></td>
</tr>
<tr>
<td><center>ICQ администрации:
<br><img src="http://infiniti1985.ucoz.ru/desire/menu/img/icq.gif" alt="icq">557-559<br></center> </td>
</tr>
<tr>
<th id="chamaelon_head"><img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" onload="cross()" height="15px" width="1px" /><a href="#">..::Дополнительное меню::..</a></th>
</tr>
</table>
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css6()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css5()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css4()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css3()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css2()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css1()" />
<tr id="reserv">
<td><img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="7px" onload="cross()" /></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/people/birthday"target="_blank" class="chamaelon_point">Дни рождения</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/people/top"target="_blank" class="chamaelon_point">ТОП 10</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/help"target="_blank" class="chamaelon_point">Помощь</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/creation/?"target="_blank"" class="chamaelon_point">Творчество</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/"target="_blank"" class="chamaelon_point">Форум чата</a></td>
</tr>
<tr>
<td align="center"><a href="http://ваш чат/page/1"target="_blank"" class="chamaelon_point">Звания</a></td>
</tr>
<tr>
<td align="center"><a href="http://august4u.net/"target="_blank"" class="chamaelon_point">Создать чат</a></td>
</tr>
<tr>
<td><center>ICQ администрации:
<br><img src="http://infiniti1985.ucoz.ru/desire/menu/img/icq.gif" alt="icq">557-559<br></center> </td>
</tr>
<tr>
<th id="chamaelon_head"><img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" onload="cross()" height="15px" width="1px" /><a href="#">..::Дополнительное меню::..</a></th>
</tr>
</table>
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css6()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css5()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css4()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css3()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css2()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css1()" />
Саму картинку - http://infiniti1985.ucoz.ru/desire/menu/img/px.gif
можете перенести себе на хост. Либо на бесплатные хосты.
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css6()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css5()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css4()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css3()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css2()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css1()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css5()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css4()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css3()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css2()" />
<img src="http://infiniti1985.ucoz.ru/desire/menu/img/px.gif" height="1px" onload="parse_css1()" />
parse_css2() - тут ставим номера айди функций скрипта. Ну естественно скольео у вас будет дизайнов, точнее функций id-хамелеон. У меня шесть а у вас естественно по разному.
Итак вроде разобрал по полочкам что да где. Если вдруг у кого то, что то, не получится, то задаём вопросы коминтируем итд. Мы постараемся вам разъяснить что и как.
P/S Пользуйтесь на здоровье.