» »

Бывший низ сайта от сайта 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/88x31.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/88x31.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/88x31.png" width="88" border="0" height="31"></a>
  </div></td></tr></table>
14.10.2012 Просмотров: 1240 Комментарий: (12)

Поделиться в социальных сетях

Материал разместил

Комментарий: 11
ucozmental
ucozmental 16.01.2016 23:541
0
Ух ты, вот это круто, точно поставлю, если что поможете потом настроить.
Сафрон
Сафрон 17.01.2016 00:122
0
Ставил его, так как сразу скажу, там нужно настраивать, если это окошко не нужно, то можете устанавливать.
Maryges
Maryges 17.01.2016 00:233
0
Вот низ мне понравился, такой вообще в первые вижу.
Tergran
Tergran 17.02.2016 23:444
0
Мне вот понравилось, просто надоели темные и широкие, здесь сделано не обычно, а что статистика, можно информер поставить или убрать, да кнопку вверх установить.
tolyan163rus
tolyan163rus 10.04.2016 23:105
0
Что за информер форум был? интересно прост:)
Kosten
Kosten 11.04.2016 00:446
0
Это не информер, а просто кнопка сделана, что на форум можно было выйти, а так показано, что можно поставить не одну кнопку. А так по сути на сайте стоял этот низ сайта раньше здесь, только с кнопкой вверх.
94tolyan163
94tolyan163 11.04.2016 09:457
0
Как не информер? $MYINF_3$ smile
94tolyan163
94tolyan163 11.04.2016 09:548
0
Статистика на форум не идёт.
Kosten
Kosten 11.04.2016 12:549
0
Все правильно, там другие операторы за нее отвечают, и здесь можете посмотреть, на главной и на форуме.
94tolyan163
94tolyan163 11.04.2016 13:2110
0
я о том что низ подойдет с таким статом где нету форума) а так выликолепно выглядит
Kosten
Kosten 11.04.2016 13:3511
0
Здесь полностью согласен, он почти 2 года стоял на сайте, а вот на форуме другой был низ, что тоже нормально сделан.
avatar