задний фон сайта на весь экран

Просто на форуме разбиение произошло адреса:

_http://coderhs.com/archive/background_as_window

На всякий случай короткая - будет работать до субботы _http://linktmp.com/6/KwDCWpP

Сам код встраивание:

Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Full Size Background Image jQuery Plugin - Demo | bavotasan.com</title> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.fullbg.min.js"></script> <style type="text/css"> .fullBg {    position: fixed;    top: 0;    left: 0;    overflow: hidden; }  #maincontent {    position: absolute;    top: 300px;    left: 0;    z-index: 50;    width: 100%;    background: #fff;    opacity: 0.9;    filter: alpha(opacity=90);    }  #box {    width: 600px;    margin: auto;    padding: 0 10px;    }     h1 {    margin-top: 12px;    font-size: 40px;    text-align: center;    line-height: 44px;    font-weight: normal;    font-family: Georgia,serif;    color: #222;    }     h2 {    margin-top: 0;    font-size: 24px;    line-height: 28px;    font-weight: normal;    font-family: Georgia,serif;    color: #C52D08;    }  a {    text-decoration: none;    outline: none;    color: #C52D08;    }        a:hover {       text-decoration: underline;       } </style> </head>  <body> <img src="images/bg.jpg" alt="" id="background" /> <div id="maincontent">  <div id="box">  <h1>Full Size Background Image jQuery Plugin</h1>  <h2>Демо</h2>       Просто измените размер окна и увидете работу плагина в действии. 
Когда бы размер окна не менялся, фоновое изображение также изменит свой размер. 
И всегда будет сохранять правильное соотношение сторон.      </div> </div> <script type="text/javascript"> $(window).load(function() {    $("#background").fullBg(); }); </script>  </body> </html>

Изменено: Coder - 1 Ноября 2014 13:13

Олег

Сообщений: 112 Регистрация: Авг 2010

1 Ноября 2014 13:37

почему то у меня 2 картинки сразу показывает. Одна по верх дургой.

Coder

Сообщений: 10609 Регистрация: Мар 2013

1 Ноября 2014 13:48

Цитата
Олег пишет: почему то у меня 2 картинки сразу показывает. Одна по верх дургой.

В примере на сайте показывает правильно, вроде как - нужно смотреть, что сделано не так.

Web Master

Сообщений: 82 Регистрация: Окт 2014

1 Ноября 2014 15:29

Если фон (картинка) однотонный или рисунок не имеет значения - можно так

Код
<body style="background-image: url(/путь к картинке) !important;">

Изменено: Web Master - 1 Ноября 2014 15:32

Олег

Сообщений: 112 Регистрация: Авг 2010

1 Ноября 2014 17:27

Цитата

Web Master пишет:
Если фон (картинка) однотонный или рисунок не имеет значения - можно так

Код
<body style="background-image: url(/путь к картинке) !important;">

картинка по всей странитце будет ?

sharkson

Сообщений: 5425 Регистрация: Янв 2014

1 Ноября 2014 18:36

Цитата
Олег пишет: картинка по всей странитце будет ?

Если у вас размеры картинки совпадают с размерами страницы - то будет одна картинка по всему фону. Там где не совпадает - она будет дублироваться кусками.

НАДЕЖНЫЙ И НЕДОРОГОЙ ХОСТИНГ ТУТ
НЕДОРОГОЙ ХОСТИНГ
ПРОДАМ БЛОГ ЖЖ
СОЗДАНИЕ И НАСТРОЙКА MediaWiki и phpbb3

SynyAlex

Сообщений: 1305 Регистрация: Июл 2012

#10

1 Ноября 2014 18:59

Цитата
sharkson пишет: Там где не совпадает - она будет дублироваться кусками

тогда растянуть {background-size: 100%;}

sharkson

Сообщений: 5425 Регистрация: Янв 2014

#11

1 Ноября 2014 19:43

Цитата
SynyAlex пишет: тогда растянуть {background-size: 100%;}

Да или репит поставить - это хорошо для однообразного бэка.

kirov :) Сообщений: 78 Регистрация: Сен 2012	#12 2 Ноября 2014 13:58 [SIZE=3]-webkit-background-size: cover;[/SIZE] [SIZE=3]-moz-background-size: cover;[/SIZE] [SIZE=3]background-size: cover;[/SIZE] Изменено: kirov :) - 2 Ноября 2014 14:01

23.02.2020 20:28	Перевод сайта на англ.язык
28.07.2019 09:45	Перенос описания категории вниз сайта, под посты
29.04.2019 19:19	Не работает код с сайта issuu
27.04.2019 10:49	Перевод сайта DLE на https
06.04.2019 09:20	Доработка сайта на dle, кто поможет.

Новые темы	Объявления	Свободное общение
09:57 3snet - гемблинг, беттинг, форекс, бинарные опционы, майнинг 19:33 LOSPOLLOS.COM - Конвертим по рецепту Хайзенберга. Dating, Mainstream, Binary Options 17:02 Webvork - международная товарная СРА сеть с сертифицированными офферами на Европу. 15:12 Несколько статей хорошо выдаются в Гугле, но отвратительно в Яндексе 13:40 Dao.AD: Монетизация и покупка Push/Pops/Inpage и Video трафика! 11:41 2Index - быстрая индексация страниц сайта и обратных ссылок 23:00 Продвижение по ключам	14:11 №1 Рассылка / Инвайтинг [TELEGRAM] \| Приватный метод 14:10 Trustpilot Reviews \| Подниму рейтинг вашей компании 14:10 Продвижение YouTube видео в топ поиска \| Любой тип контента \| Гарантия результата 14:10 Установка\|Настройка\|Доработка\|Наполнение сайтов\|Дизайн\|3D\|Видеомонтаж 12:12 SellBuycoin.io - надежный проводник в мир обмена криптовалют на фиат и наличные по РФ! 10:24 Linken Sphere – браузер-антидетект нового поколения 04:03 Просто $0.04/IP 9PROXY.COM Резидентные прокси Неограниченная пропускная способность Уникальная политика замены Без чёрного списка	16:49 monetizer.agency – рекламная сеть для взрослого и развлекательного трафика. 100$ новому вебмастеру 20:43 Добро пожаловать в цифровой мир... 15:59 Про мясо 23:09 ПП от PMS remote.team - 200$ за команду 13:28 Компьютерная мышь 22:55 Ну что, кто куда деваете свои сайты? 22:34 Используете беспроводные наушники?