Форум поддержки пользователей ZeroParking

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Форум поддержки пользователей ZeroParking » Архив тем » Проблема с Задним Фоном


Проблема с Задним Фоном

Сообщений 1 страница 9 из 9

1

Приятного времени суток.
Прошу прощения, если дублирую уже кем-то до меня заданный вопрос, но поиском пользуюсь регулярно, ответы поиска просмотрела если не все, то многие, однако решение своей проблемы не нашла.
А теперь к делу.

Это Адрес моего Форума
Вот так вот он отображается у меня:
http://i039.radikal.ru/1012/4c/78ddfe334f65t.jpg

А вот так у большинства остальных посетителей:
http://i012.radikal.ru/1012/a0/ca02c17af1e5t.jpg

Я так понимаю, все дело в расширении экрана. У кого-то диагональ монитора больше, у кого-то меньше, из-за этого задний фон встает иначе. Но должен же быть какой-то способ сделать так, чтобы у всех отображалось также, как у меня? Потому что подбирать размер картинки - не выход, ведь тогда форум будет некорректно отображаться у меня самой.
Собственно, я пользовалась здесь, на Форуме Техподдержки, поиском именно чтобы найти необходимый тег, который растянул бы задний фон. Но в ответах лишь способы его зафиксировать (этот тег у меня и стоит, и мы видим, что толку нет), замостить (что мне вообще не подходит) и так далее.
Код стоит следующий:

Код:
<style type="text/css">
HTML, BODY {background-color: #000000;
	background-image: url(
' http://s008.radikal.ru/i305/1012/80/751b2400c57a.jpg ');
	background-attachment: fixed;
background-position: top center;
background-repeat: no-repeat;
	color: #ffffff;
	}
</style>

Что я делаю не так?..
Какой тег может решить мою проблему?

0

2

Кимера Кай
нет, увы.. можно замостить по стороне сделать неподвижным - но растянуть - ни как нельзя. Так что просто напросто нужно делать сам фон такого плана что бы у него не было не начала ни конца, а по центру картинку - в определенной стороне к примеру с лева и по центру ее замостить - и все будет выглядеть вполне реально.

+1

3

Чтож... спасибо за попытку помочь. Увы, таким образом рушится вся задумка.
Ладно, буду искать варианты и думать что-то другое...
Если вдруг кто-то сможет все же что-нибудь подсказать - буду крайне признательна.
Благодарю за внимание.

0

4

Кимера Кай написал(а):

Я так понимаю, все дело в расширении экрана.

Да, а под него можно адаптировать только img. Расширение экрана у меня, например, не слишком большое, но если растянуть картинку, то получается она не очень качественной.
Её, пожалуй, надо заменить на картинку побольше. 

<style type="text/css">
#backgr {position:fixed; z-index:-2; height: 100%; width:100%; left:0; top:0; bottom:0; right:0; paddin:0; margin:0;}
#blockback {position: absolute; z-index:-1; height: 100%; width:100%; left:0; top:0; bottom:0; right:0; paddin:0; margin:0; background: url('http://s004.radikal.ru/i205/1012/ae/811e3e6178a8.png');}
</style>

<div id="blockback"></div>
<div id="backgr"><img src="http://s008.radikal.ru/i305/1012/80/751b2400c57a.jpg" height="100%" /></div>

Где красным - ссылка на вашу картинку.
Синее трогать не следует - это картинка абсолютной прозрачности, запрещающая сохранение вашего фона обычным способом(как обычной картинки).

Отредактировано Kven (2010-12-18 20:43:19)

0

5

Для уточнения: код, который вы мне предложили, нужно вставить на место того, что я показывала выше? Или еще что-либо менять\убрать нужно?

0

6

можно поставить как дополнительный.

Если заменять, то на это:

<style type="text/css">
HTML, BODY {background-color: #000000;color: #ffffff;}
#backgr {position:fixed; z-index:-2; height: 100%; width:100%; left:0; top:0; bottom:0; right:0; paddin:0; margin:0;}
#blockback {position: absolute; z-index:-1; height: 100%; width:100%; left:0; top:0; bottom:0; right:0; paddin:0; margin:0; background: url('http://s004.radikal.ru/i205/1012/ae/811e3e6178a8.png');}
</style>

<div id="blockback"></div>
<div id="backgr"><img src="http://s008.radikal.ru/i305/1012/80/751b2400c57a.jpg" height="100%" /></div>

Цвета имеют те же значения.
В хтмл-верх.

Отредактировано Kven (2010-12-18 20:39:28)

0

7

to Kven

Оу... Хм... Ну, что я могу сказать.
У меня как все стояло нормально, так и стоит. Я попросила нескольких своих друзей протестить код - зайти на форум, обновить его пару раз и заскринить, что получилось.
Итогом стало: не работает ни одна ссылка. То бишь - навигация, чат, переходы по подфорумам и так далее. Кнопки не нажимаются и прочее. Все - одной единой картинкой, как вы и говорили. У меня самой - аналогичная ситуация.

0

8

Кимера Кай написал(а):

не работает ни одна ссылка

исправил пост выше. Проблема была в z-index'е. Див, перекрывающий изображения, перекрыл и весь форум.
Сейчас проверьте. Если и так не сработает - ничем больше помочь не смогу.

0

9

Кимера Кай написал(а):

Я так понимаю, все дело в расширении экрана. У кого-то диагональ монитора больше, у кого-то меньше, из-за этого задний фон встает иначе. Но должен же быть какой-то способ сделать так, чтобы у всех отображалось также, как у меня? Потому что подбирать размер картинки - не выход, ведь тогда форум будет некорректно отображаться у меня самой.Собственно, я пользовалась здесь, на Форуме Техподдержки, поиском именно чтобы найти необходимый тег, который растянул бы задний фон. Но в ответах лишь способы его зафиксировать (этот тег у меня и стоит, и мы видим, что толку нет), замостить (что мне вообще не подходит) и так далее. Код стоит следующий:

Ну такой ход к примеру: (cохраните в топике на форуме весь текущий HTML верх и замените на этот: (коректность работы со скриптами и в топике не проверял), если в принципе устроит, переделаем под более корректное, скриптом
Должно получиться примерно так > http://hostjs-mybb2011.narod.ru/Kimera_Kayj.htm

Код:
</div></div></div>

<img src="http://s008.radikal.ru/i305/1012/80/751b2400c57a.jpg" style="position:fixed;left:0;top:0;width: 85%; cursor:pointer;margin: 0 0 0 0;"/>
<div id="pun">
<div id="pun-message" class="punbb">
<div id="html-header">
	<style type="text/css">
html, body, #pun-title TABLE, #pun-title .title-logo, #pun-title,
 #pun-title .section, #pun-title .title-logo-tdl,
 #pun-title .title-logo-tdr  {background-image: url(); !important; width : 99%;}
 #pun-title .title-logo-tdr  {background-color : #000000;}
.title-logo span {visibility:visible; !important; }
</style>

<style type="text/css">
#pun-title table {height: 10px; width: 10%;}
</style>


<style>
#pun {position:absolute; right:0;left:30%;width:70%;}
</style>


<style type="text/css">
.pa-avatar { text-align: center;}
</style>


<style type="text/css">
.pa-adnote{ text-align: center;}
.pa-from{ text-align: center;}
.pa-reg{ text-align: center;}
.pa-posts{ text-align: center;}
.pa-reputation{ text-align: center;}
.pa-sex{ text-align: center;}
.pa-icq{ text-align: center;}
.pa-ip{ text-align: center;}
.pa-online{ text-align: center;}
.pa-age{ text-align: center;}
.pa-mailagent{ text-align: center;}
.pa-reg { text-align: center;}
.pa-avatar, .pa-title, .pa-author { text-align: center;}
.pa-time-visit{ text-align: center;}
.pa-last-visit{ text-align: center;}
.pa-fld1{ text-align: center;}
.pa-fld2{ text-align: center;}
.pa-fld3{ text-align: center;}
</style>


<style>
#form-buttons table, .punbb .formal textarea {width:99%}
#form-buttons td {padding:0; line-height:0; background-position:center; background-repeat:no-repeat}
#form-buttons td img {height:26px; width:100%}
#button-font {background-image:url('http://img72.imageshack.us/img72/6545/fontnh0.png')}
#button-size {background-image:url('http://img72.imageshack.us/img72/1851/fontsizeuq4.png')}
#button-bold {background-image:url('http://img72.imageshack.us/img72/8796/boldcc8.png')}
#button-italic {background-image:url('http://img72.imageshack.us/img72/6549/italybn9.png')}
#button-underline {background-image:url('http://img72.imageshack.us/img72/2900/underlineca3.png')}
#button-strike {background-image:url('http://img72.imageshack.us/img72/4773/64794260pn1.png')}
#button-left {background-image:url('http://img72.imageshack.us/img72/5779/alignleftyo8.png')}
#button-center {background-image:url('http://img265.imageshack.us/img265/4157/aligncenterpj5.png')}
#button-right {background-image:url('http://img72.imageshack.us/img72/4153/alignrightxk1.png')}
#button-link {background-image:url('http://img72.imageshack.us/img72/1305/linkwi1.png')}
#button-email {background-image:url('http://img72.imageshack.us/img72/3971/mailbe5.png')}
#button-image {background-image:url('http://img72.imageshack.us/img72/1939/picba6.png')}
#button-hide {background-image:url('http://img72.imageshack.us/img72/4175/hidetxtgj8.png')}
#button-quote {background-image:url('http://img72.imageshack.us/img72/3276/quotegw6.png')}
#button-code {background-image:url('http://img72.imageshack.us/img72/1515/codemg6.png')}
#button-color {background-image:url('http://img72.imageshack.us/img72/5148/colorspx0.png')}
#button-smile {background-image:url('http://img72.imageshack.us/img72/1026/smileshl5.png')}
#button-keyboard {background-image:url('http://img72.imageshack.us/img72/7042/keyboardxq3.png')}
#button-imageup {background-image:url('http://img72.imageshack.us/img72/2582/loadimageme3.png')}
</style>


<style type="text/css"> 
#pun-navlinks .container {background-image : url(http://i038.radikal.ru/1010/28/ee5599511c50.jpg);}

#pun-ulinks .container {background-image : url(http://i038.radikal.ru/1010/28/ee5599511c50.jpg);}

#pun-status .container {background-color : #000000;}

#pun-crumbs1 .container {background-image : url(http://i038.radikal.ru/1010/28/ee5599511c50.jpg);}

#pun-crumbs2 p.container {background-image : url(http://i038.radikal.ru/1010/28/ee5599511c50.jpg);}

#pun-about p.container {background-color : #000000;}

#html-footer .container {background-image : url(http://i038.radikal.ru/1010/28/ee5599511c50.jpg);}

</style>


<style type="text/css">
#pun-announcement h2 {display: none}
#pun-announcement .container {padding-top: 1em}
</style>

Отредактировано Deff (2010-12-19 00:35:06)

0


Вы здесь » Форум поддержки пользователей ZeroParking » Архив тем » Проблема с Задним Фоном


Рейтинг форумов | Создать форум бесплатно