Свернуть

Новости проекта

Долгожданное открытие студии theRealARTs

Ура! Товарищи,приятная новость, свершилось затянувшееся открытие сайта theRealARTs, занимающегося разработкой в сфере Веб-Дизайна и графики.

Молодой, энергичный, яркий и индивидуальный проект спешит по хвастаться своим открытием и ждет новых посетителей на свой сайт!

12 Января 2015 Подробнее

Наша группа Вконтакте

Мы собираем и публикуем материалы не только на сайте, но и в нашей группе Вконтакте, нужно отметить то, что на сайте публикуются не все материалы, небольшая часть выкладывается только в группе.

17 Марта 2014 Подробнее

Свернуть

Прямой эфир

Пользователь: artCreative

В раздел по теме: Вид материалов как на Pinterest
Пользователь: artCreative

В раздел по теме: Ссылка на источник при копировании текста
Пользователь: muxa

В раздел по теме: Ссылка на источник при копировании текста
Не работает
Пользователь: muxa

В раздел по теме: ОТЛИЧНЫЙ БАНЕР ДЛЯ UCOZ
Все работает класс
Пользователь: muxa

В раздел по теме: Всплывающее меню на чистом CSS
Не работает
Пользователь: muxa

В раздел по теме: Шаблон Фотошоп-Мастер
Пользователь: vovany

В раздел по теме: Уникальная страница технических работ для uCoz

Свернуть

Статистика

Пользователи

Гости сайта

Онлайн
Кто был
СЧ

[Статистика недоступна]

Всего пользователей: 1492 ⁺⁰
Всего материалов [?]: 1434 +

Полный список

Вы здесь: Главная » Рубрики » Скрипты для uCOZ » Переключатели и кнопки » Скрипт смены фона сайта.

Скрипт смены фона сайта.

Опубликовал: artCreative™
Категория: Переключатели и кнопки
Дата: 14 Декабря 2025 в 13:03

0 голосов

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

Итак начнём с конструктора и создания нового блока.
После создания в конструкторе блока, помещаем в него такой HTML код:

<center>[<small><a href="javascript://" onclick="deletebg()">Удалить свой фон</a></small>] 
[<small>Растянуть фон? <input id="str" 
type="checkbox"></input></small>]</center>  
  <input

 id='bg' placeholder='Ваша прямая ссылка на фон, без кавычек' size='35' onclick='select()'></input><center><button 
value='Сменить фон' onclick='bgchange()'>Сменить 
фон</button></center>  
  Или используйте уже имеющееся:<br>  
  <select id="bgs">  
  <option selected disabled>Варианты фона</option>  
  <option disabled>Вернуть свою ссылку на фон</option>  
  <option value="http://ucozua.ru/Scripts/35/d49ae7da268da6ef86cdca0be8625b54.png">Якобы windows 8</option>  
  </select>  
  <script type="text/javascript">  
  var dmn="scripttests.ucoz.ru";  
  $(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>

Далее заходим в Общие шаблоны ->Таблица стилей (CSS) и помещаем в любое место, лучше в самый конец чтобы не запутаться :

.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;  
  }

Далее надо в Глобальные блоки->Верхняя часть сайта в самое начало запихнуть следующий код:

<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(/wallpaper.jpg)'}  
  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>

Сохраняем и переходим к следующему пункту настройка всего выше написанного.Итак, скрипт вы установили, далее проверяем код из первого пункта, меняем, если хотим, в списке

<select> в пунктах <option>

на прямые ссылки на фон, к примеру

<option value="http://ucozua.ru/wallpaper.png">Фон 1</option>

Ниже смотрим строчку var dmn="ваш домен"; тут надо вставить ваш домен, к примеру var dmn="uweb.su"; переменная вроде относится к блоку и должна работать, если не будет, то просто вместо букв dmn вставте туда в кавычках ваш домен.

Далее смотрим код из третьего пункта, строчка

document.body.style.backgroundImage = 'url(/wallpaper.jpg)'

выставляем вместо /wallpaper.jpg путь до вашего фона который будет стандартным и постоянным для всех.

Ну и вроде бы всё, ах да про css и функцию растяжки, как мы все знаем есть фон который либо меньше, либо больше отображаемой части сайта, так вот эта функция (если включена) растягивает (втискивает) ваш фон в границы сайта, css спокойно настраивается и имеет довольно привычный вид.
Фон применяется к тегу body в качестве background-image, так что по идее должно работать на любом сайте.

Спонсор материала: Студия Веб-Дизайна RealARTs

Для того, чтобы скачивать файлы Вам нужно авторизироваться или зарегистрироваться

Просмотров 851 « Назад

Теги материала: смены, скрипт, сайта., фона

Комментарии пользователей

Внимание ! У вас нет прав для добавления комментариев.
Пожалуйста авторизуйтесь или зарегистрируйтесь.

E-mail отправителя *:
Тема письма:
Текст сообщения *:

ПАНЕЛЬ УПРАВЛЕНИЯ

Вы здесь: Главная » Рубрики » Скрипты для uCOZ » Переключатели и кнопки » Скрипт смены фона сайта.

Скрипт смены фона сайта.

Комментарии пользователей