Авторизация

Изменяемый фон сайта с использованием Cookie

Скачиваем папку fon с помощью кнопки ниже и заливаем в корень сайта в файловый менеджер

Вставляем следующий код туда, где ходим видеть кнопку:

<script src="/fon/cookie.js"></script>  
<div class="ff_fon">  
<a href="#" class="drox"><img alt="fon" title="Сменить фон сайта" src="/fon/ico_panel.png"></a>  
<div class="ff_cell_ff">  
<span class="ff_ugol_ff"></span>  
<div class="ff_content_en">  
<a href="#"><img id="jp1" src="/fon/1.jpg"></a>  
<a href="#"><img id="jp2" src="/fon/2.jpg"></a>  
<a href="#"><img id="jp3" src="/fon/3.jpg"></a>  
<a href="#"><img id="jp4" src="/fon/4.jpg"></a>  
<a href="#"><img id="jp5" src="/fon/5.jpg"></a>  
<a href="#"><img id="jp6" src="/fon/6.jpg"></a>  
<a href="#"><img id="jp7" src="/fon/7.jpg"></a>  
<a href="#"><img id="jp8" src="/fon/8.jpg"></a>  
<a href="#"><img id="jp9" src="/fon/9.jpg"></a>  
</div>  
</div>  
</div>  
<script src="/fon/cok.js"></script>

Вставляем в самый низ таблицы стилей CSS:

.ff_fon {  
  float:right;  
  display:block;  
  position:relative;}  

.ff_fon .drox {padding: 0px 7px;}  
.ff_cell_ff, .ff_ugol_ff {width:35px;}  

.ff_cell_ff {  
  left:-999em;  
  z-index:998;  
  position:absolute;  
  margin: 0 -2px 0 auto;}  
   
.ff_content_en {  
  margin:0;  
  width:35px;  
  text-align:center;  
  overflow:hidden;  
  background:#333;}  

.ff_content_en a:link,  
.ff_content_en a:visited {  
  float:left;  
  width:35px;  
  padding: 5px 0px 3px 0px;  
  border-bottom: 1px solid #888;}  

.ff_content_en a:hover {background:#5f5f5f;}  
.no_bb:link,  
.no_bb:visited {border-bottom:none!important;}  
   
.ff_fon:hover .ff_cell_ff{  
  top:27px;  
  right:0;  
  left:auto;}  

.ff_ugol_ff {  
  height:7px;  
  top: -7px;  
  position:absolute;  
  background:url(/fon/ugolok.png) no-repeat center bottom;}

Использовать собственные фоны можно заменив /fon/1.jpg и другие ссылками на нужные фоны.

Просмотров: 160 | Добавил: admin | Комментарии: 0
avatar