Выбор фона сайта для uCoz
827материалов
228тем на форуме
3004комментария
6161пользователь

Выбор фона сайта для uCoz


Описание:

Большинство сайтов используют изображение для заднего фона своего проекта. А что если дать возможность самому менять фон сайта из нескольких вариантов, которые ему можно предоставить? С этим скриптом пользователь на вашем сайте сможет поменять фон сайта, с запоминанием на cookie. Данный скрипт позволит пользователю поменять фон сайта на любой из предложенных, а браузер запомнит этот фон.

Установка

1. Создайте папку "background" в файловом менеджере и загрузите туда все файлы из папки background в архиве, который вы скачаете по ссылке ниже. В нем находятся изображения, которые будут предоставлены для выбора.

2. Вставьте этот код в то место, где хотите мы, будет отображать кнопку изменения фона (Лично я поставил в верхнюю часть сайта):
Код
<script src="/background/cookie.js"></script>  
<div class="ff_fon">  
<a href="#" class="drox"><img alt="fon" title="Сменить фон сайта" src="/background/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="/background/1.jpg" width="20px" /></a>  
<a href="#"><img id="jp2" src="/background/2.jpg" width="20px" /></a>  
<a href="#"><img id="jp3" src="/background/3.jpg" width="20px" /></a>  
<a href="#"><img id="jp4" src="/background/4.jpg" width="20px" /></a>  
<a href="#"><img id="jp5" src="/background/5.jpg" width="20px" /></a>  
<a href="#"><img id="jp6" src="/background/6.jpg" width="20px" /></a>  
<a href="#"><img id="jp7" src="/background/7.jpg" width="20px" /></a>  
<a href="#"><img id="jp8" src="/background/8.jpg" width="20px" /></a>  
<a href="#"><img id="jp9" src="/background/9.jpg" width="20px" /></a>  
</div>  
</div>  
</div>  
<script src="/background/cok.js"></script>

3. Основную часть установки мы завершили. Теперь давайте пропишем необходимые нам стили и вставим их в самый низ Таблицы стилей (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;
}

Чтобы изменить список предлагаемых фонов для пользователей, то замените изображения 1, 2, 3, 4... на свои. После этого можно считать нашу установку завершенной. Ваши пользователи теперь получат возможность изменять фон сайта, который им больше понравятся.

ЗАКАЗАТЬ УСТАНОВКУ

Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 14.12.2015 в 16:00
Материал просмотрен: 1609 раз
Категория материала: Скрипты для uCoz
К материалу оставлено: 5 комментариев

Пожаловаться
Сказать спасибо
Источник

5 комментариев


NarutoPro
Влад @NarutoPro 14.12.2015 16:441
+6
Классная вещь. Спасибо laughing
avatar
Михаил Кацай @MKatsay 23.12.2015 07:252
+1
Всем привет, help me please, не работает... клацаешь на нужный фон.......и как в рекламе яндекс браузера "И не чего такого не случилось. cool "
TenJoy
Борис @TenJoy 28.12.2015 19:023
+1
не работает клацаешь на смену фона не чего не происходит
avatar
Юра @Prepod12 25.01.2016 01:344
+1
....и как в рекламе яндекс браузера "И не чего такого не случилось. cool "
Ромчик
Значит не правильно установили, ссылку на сайт
avatar
Вход через социальные сети
Работа в компании uCoz
uSocial - социальные кнопки
uLike – кнопка «Мне нравится»
Статистики нашего сайта