вРазные полезности

Бывший низ сайта от сайта zornet

 
Вот решил выложить низ сайта который создал модератор Supermenыч. Раньше меня просили дать код йа не давал как не сам создал. Теперь вот решил залить его на сайт так как с создателем Supermenыч связи нет уже несколько месяцев и возможности нет спросить. Что сказать про низ сайта, реально создан по красоте, один из многих низов сайта который подойдет как на светлый сайт по дизайну так и на темный дизайн сайта. Кто раньше видел его на старом шаблоне, знают у него есть 3 функций.Которые находятся с левой стороны и также 3 окна под баннеры.
Приступаем к установке:
С начало пропишем стиль в CSS

Code
.footer
background:-webkit-linear-gradient(top,#808080,#202020);
background:-moz-linear-gradient(top,#808080,#202020);
height-max:20px;
width:100%;
margin-top:24px;
padding-left:20px;
padding-bottom:20px;
padding-top:20px;
border-top:1px solid #c0c0c0;

.knopka
position:absolute;
display:inline-block;
background:#404040;
width:100px;
height:15px;
color:white;
padding:5px;
vertical-align:middle;
text-align:center;
border-top-left-radius:4px;

.knopka:hover
background:white;
color:black;
-webkit-box-shadow:0 0 5px black;
-moz-box-shadow:0 0 5px black;
cursor:pointer;

.knopka1
position:absolute;
display:inline-block;
background:#404040;
width:100px;
height:15px;
color:white;
padding:5px;
text-align:center;
margin-left:107px;

.knopka1:hover
background:white;
color:black;
-moz-box-shadow:0 0 5px black;
-webkit-box-shadow:0 0 5px black;
cursor:pointer;

.knopka2
position:absolute;
display:inline-block;
background:#404040;
width:100px;
height:15px;
color:white;
padding:5px;
text-align:center;
margin-left:214px;
border-top-right-radius:4px;

.knopka2:hover
background:white;
color:black;
-webkit-box-shadow:0 0 5px black;
-moz-box-shadow:0 0 5px black;
cursor:pointer;

.knopka2:active
-webkit-box-shadow:inset 0 0 5px black;
-moz-box-shadow:inset 0 0 5px black;

.drop
-webkit-box-shadow:0 0 5px rgba(0,0,0,25);
-moz-box-shadow:0 0 5px rgba(0,0,0,25);
width:200px;
height:100px;
background:#404040;
display:none;
border-radius:4px;
border:1px solid black;
padding:3px;
color:white;

.drop1
-webkit-box-shadow:0 0 5px rgba(0,0,0,25);
-moz-box-shadow:0 0 5px rgba(0,0,0,25);
width:200px;
height:223px;
background:#404040;
display:none;
border-radius:4px;
border:1px solid black;
padding:3px;
color:white;

.knopka:hover .drop
display:block;
position:relative;
cursor:pointer;
bottom:130px;

.knopka1:hover .drop1
display:block;
position:relative;
cursor:pointer;
bottom:253px;

.knopka2:hover .drop1
display:block;
position:relative;
cursor:pointer;
bottom:130px;

.position
top:200px;
vertical-align:middle;

.text
padding:3px;
height:94px;
width:auto;
background:white;
color:black;
text-align:left;

.ugol
background:url(http://zornet.ru/zornet_ru8/fon_ugol_1.png) no-repeat;
height:10px;
width:200px;

Потом идем в низ сайта и убираем старый код и прописываем наш новый.

Code
<table cellspacing=»0″>
  <tr><td valign=»middle»><div class=»position»><div class=»knopka»>Статистика<br><div class=»drop»><div class=»text»>$ONLINE_USERS_LIST$<hr size=»1″>$ONLINE_COUNTER$</div><div class=»ugol»></div></div></div></div></td><td><div class=»knopka1″>Форум<div class=»drop1″><div class=»text» style=»height:217px;»>$MYINF_3$</div><div class=»ugol»></div></div></div></td><td><div class=»knopka2″ onclick=»$(‘body’).scrollTo(top:$(‘body’).offset().top, left:0, 1500);return false;»>Наверх</div></td></tr></table>
<table class=»footer» cellspacing=»0″><tr><td width=»70%»>
  <div style=»text-shadow:0 0 3px #ccc;padding:4px;border:1px solid black;-webkit-box-shadow:inset 0 0 10px black;-moz-box-shadow:inset 0 0 10px black;background:#efefef;width:81px;border-radius:3px;color:black;text-align:center;»>
  $POWERED_BY$</div></td><td width=»100″ align=»left»><div style=»border-radius:3px;padding:5px;border:1px solid black;-webkit-box-shadow:inset 0 0 5px black;-moz-box-shadow:inset 0 0 5px black;background:#efefef;width:90px;height:31px;»><img src=»http://zornet.ru/zornet_ru7/88×31.png»></div></td><td width=»100″><div style=»border-radius:3px;padding:5px;border:1px solid black;-webkit-box-shadow:inset 0 0 5px black;-moz-box-shadow:inset 0 0 5px black;background:#efefef;width:88px;height:31px;»> <a href=»/forum/109″ target=»_blank» title=»Место свободно 88х31″><img src=»http://zornet.ru/zornet_ru7/88×31.png» width=»88″ border=»0″ height=»31″></a>
</div></td><td width=»100″ style=»margin-right:15px;»><div style=»border-radius:3px;padding:5px;border:1px solid black;-webkit-box-shadow:inset 0 0 5px black;-moz-box-shadow:inset 0 0 5px black;background:#efefef;width:90px;height:31px;»> <a href=»/forum/109″ target=»_blank» title=»Место свободно 88х31″><img src=»http://zornet.ru/zornet_ru7/88×31.png» width=»88″ border=»0″ height=»31″></a>
  </div></td></tr></table>

источник: zornet.ru

Похожие посты