Скрипт позволяет пользователям выбирать свой фон Вашего сайта!
Каждый желающий может выбрать из списка имеющихся или указав адрес картинки поставить свой фон на Ваш сайт!
Скрипт работает на куках!
Установка скрипта:
1. Создаём новый глобальный блок
В вверху сайта в панели администратора выбираем:
Конструктор ---> Включить конструктор ---> Добавить блок+ ---> в настройках нового блока выбираем HTML и вставляем этот код туда:
Code
<center>[<small><a href="javascript://" onclick="deletebg()">Удалить свой фон</a></small>]<BR>[<small>Растянуть фон? <input id="str" type="checkbox"></input></small>]</center>
<input id='bg' placeholder='Ваша прямая ссылка на фон' size='22' onclick='select()'></input><center><button value='Сменить фон' onclick='bgchange()'>Сменить фон</button></center>
Или используйте уже имеющееся:<br>
<select id="bgs">
<option selected disabled>Варианты фона</option>
<option disabled>Вернуть свою ссылку</option>
<option value="http://fotki.ucoz.ua/_ph/16/2/422749439.jpg">Природа</option>
<option value="http://fotki.ucoz.ua/_ph/16/2/657599157.jpg">Природа1</option>
<option value="http://fotki.ucoz.ua/_ph/16/2/332981696.jpg">Природа2</option>
<option value="Адрес фона1">Фон1</option>
<option value="Адрес фона 2">Фон2</option>
</select>
<script type="text/javascript">
var dmn="ваш домен";
$(document).ready(function() {
$('#bgs').change(function(){
$('#bg').val($("select#bgs").val());
});
$('#str').change(function(){
if($("#str").is(':checked')){
$('body').removeClass('bg').addClass('bg_temp');
setCookie("stretched", "yes", { expires: 999999999, path:"/", domain:dmn} );
}else if($("#str").is(':not(:checked)')){
$('body').removeClass('bg_temp').addClass('bg');
setCookie("stretched", "no", { expires: 999999999, path:"/", domain:dmn} );
}
});
var backgr=getCookie("background")
if(backgr){$('#bg').val(backgr);
$('#bgs :nth-child(2)').attr("value",backgr);
$('#bgs :nth-child(2)').removeAttr("disabled");}
});
function deletebg(){
if(!getCookie("background")){alert("У вас нет установленного фона, удалять нечего")}else{
setCookie("background", null, { expires: -1, path:"/", domain:dmn} )
alert("Фон выставлен по умолчанию");
location.reload(true)}
}
function bgchange(){
if(bg.value!=''){var bg_link=bg.value
if(!bg_link.match(/http[^\s\"]+[^\" >]*?/ig)){alert("Вы ввели неверную ссылку на фон")}
else{
setCookie("background", bg_link, { expires: 999999999, path:"/", domain:dmn} )
alert("Новый фон установлен, главная страница будет перезагружена")
location.reload(true)
}
}else{alert("Вы не ввели ссылку на фон")}
}
</script>
<option value="Адрес фона1">Фон1</option> и <option value="Адрес фона 2">Фон2</option> меняем на адреса и названия своих фонов, можно добавлять свои фоны
<option value="Адрес фона1">Фон1</option> и т.д.
далее находим строчку строчку var dmn="ваш домен";
тут надо вставить ваш домен, например var dmn="ssilki.at.ua";
2. Открываем:
Панель управления ---> Управление дизйном (шаблоны) ---> Верхняя часть сайта,
в самый вверх вставляем код:
Code
<script type="text/javascript">
function getCookie(name) {
var matches = document.cookie.match(new RegExp(
"(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
))
return matches ? decodeURIComponent(matches[1]) : undefined
}
function setCookie(name, value, props) {
props = props || {}
var exp = props.expires
if (typeof exp == "number" && exp) {
var d = new Date()
d.setTime(d.getTime() + exp*1000)
exp = props.expires = d
}
if(exp && exp.toUTCString) { props.expires = exp.toUTCString() }
value = encodeURIComponent(value)
var updatedCookie = name + "=" + value
for(var propName in props){
updatedCookie += "; " + propName
var propValue = props[propName]
if(propValue !== true){ updatedCookie += "=" + propValue }
}
document.cookie = updatedCookie
}
var bg_li=getCookie("background")
if(bg_li){document.body.style.backgroundImage = 'url('+bg_li+')';}else{document.body.style.backgroundImage = 'url(Адрес исходного фона)'}
document.body.style.padding = '0';
document.body.style.margin = '0';
$('document').ready(function(){
if(getCookie("stretched")=="yes"){$('#str').attr('checked','true');$('body').removeClass('bg').addClass('bg_temp');} else if(getCookie("stretched")=="no" || !getCookie("stretched")){$('#str').removeAttr('checked');$('body').removeClass('bg_temp').addClass('bg');}
});
</script>
в нём находим строчку:
Code
if(bg_li){document.body.style.backgroundImage = 'url('+bg_li+')';}else{document.body.style.backgroundImage = 'url(Адрес исходного фона)'}
и заменяем Адрес исходного фона на адрес фона, который будет появляться при загрузке страницы (исходного фона).
Например:
{document.body.style.backgroundImage = 'url(http://fotki.ucoz.ua/_ph/16/2/422749439.jpg)'}
3. Открываем:
Панель управления ---> Таблица стилей CSS, в самый низ вставляем код:
Code
.bg_temp{
background-Position: center;
background-Attachment: fixed;
background-Repeat: no-repeat;
background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
}
.bg{
background-Position: center;
background-Attachment: fixed;
background-Repeat: no-repeat;
}
Установка завершена!
Материалы на эту же тему:
Скрипт "Кнопка "Скачать" с показом размера файла"
Скрипт "Вокруг курсора вращается красивый мигающий круг"
Скрипт "Красивая кнопка для печати страницы"
Скрипт "Два блока в одном"
Скрипт "Описание групп в статистике форума"
Скрипт "Новый вид бокового ползунка (полосы прокрутки)"
Скрипт "Кнопка Google+ для форума Ucoz"
Индикатор символов в мини-чате Ucoz
Скрипт "Счётчик символов и слов в тексте"
Скрипт "bb-код для форума "Мигающий текст"
Скрипт "Уведомление о новом сообщении в мини-чате"
Скрипт "Раздвижной Вид материалов для форума Ucoz"