Изменяющиеся Header сайта

[Mondeo]

Появилась такая идея, что если размеры экрана менее 800х600 отображалась одна картинка, а при расширении больше 800х600 - другая, чуть пошире. Демонстрирую:

small.png

Это при 800х600.
А при 1280х1024 по бокам пустые пятна образуются.

Заранее спасибо!

[FladeX]

Можно например через javascript узнавать разрешение экрана - screen.width, screen.height. Далее в зависимости от полученных данных устанавливаем фоновое изображение/ширину стиля.
Данный способ не является универсальным - пользователь может отключить работу javascript в своем браузере, поэтому я бы посоветовал реализовать это на php, но это уже не ко мне вопрос

[Oleg NT]

Я делал это здесь:
http://c-2.ntagil.ru

пользователь может отключить работу javascript в своем браузере

его проблемы. В наше время отключать javascript — это мазохизм.

Добавлено спустя 3 минуты 46 секунд:

Код: Выделить всё

<script type="text/javascript">
//<![CDATA[
var w = screen.width;
if (w > 800)
{
     document.write('<img src="big_header.pic" alt="!" width="!" height="!" />');
}
else
{
     document.write('<img src="small_header.pic" alt="!" width="!" height="!" />');
}
//]]>
</script>

[Rayden]

а при масштабировании окна что будет?

[Oleg NT]

А нефиг окно масштабировать :-D браузер должен быть раскрыт на все окно

[Warlock75]

Как говорит Палыч, накойхер?
Устанавливаешь минимальную ширину стиля, делаешь картинку слева, чтобы смотрелось хорошо, а дальше - полет фантазии. Градиент, фоновый рисунок...

[Mondeo]

Сделал для уменьшения размера окна:

Код: Выделить всё

script type="text/javascript">
//<![CDATA[
var w=(window.innerWidth)?window.innerWidth: ((document.all)?document.body.offsetWidth:null);
if (w > 800)
{
document.write('<img src="big_header.pic" alt="!" width="!" height="!" 
/>');
}
else
{
document.write('<img src="small_header.pic" alt="!" width="!" 
height="!" />');
}
//]]>
</script>

Вопрос - куда это "вклинить"?

[FladeX]

Mondeo
как вариант - в overall_header.html

Кстати, тут по долгу службы пришлось примерно с такой же ситуацией столкнуться. В голову пришло такое решение - картинку-шапку делаем фоном, и либо центруем ее, либо выравниваем по левому краю (от картинки зависит). И будет нормально на всех разрешениях. Я даж делал так уже вроде бы))

[Mondeo]

Mondeo
как вариант - в overall_header.html

Странно как то у меня получается, т.е. совсем не получается. Отображает джаву как текст.

Код: Выделить всё

script type="text/javascript"> //''); } else { document.write(''); }

Вот что пишет. Щас я понял - phpBB - запутанный движок, сложнее во много раз чем Php-Fusion, который очень хорошо знаю.
Файл в аттаче

overall_header.rar

[Палыч]

Странно как то у меня получается

А чего странного?

script type="text/javascript">

Где открытие тега?

<script type="text/javascript">

[Oleg NT]

Отображает джаву как текст

Здес нет Java. Здесь JavaScript Это два разных языка

[Поручик]

Перед </script> надо вставить

Код: Выделить всё

// ]]>

Примерно так

Код: Выделить всё

<script type="text/javascript">
//<![CDATA[
var w=(window.innerWidth)?window.innerWidth: ((document.all)?document.body.offsetWidth:null);
if (w > 800)
{
document.write('<img src="big_header.pic" alt="!" width="!" height="!" 
/>');
}
else
{
document.write('<img src="small_header.pic" alt="!" width="!" 
height="!" />');
}
// ]]>
</script>
script type="text/javascript">
//<![CDATA[
var w=(window.innerWidth)?window.innerWidth: ((document.all)?document.body.offsetWidth:null);
if (w > 800)
{
document.write('<img src="big_header.pic" alt="!" width="!" height="!" 
/>');
}
else
{
document.write('<img src="small_header.pic" alt="!" width="!" 
height="!" />');
}
// ]]>
</script>

[Oleg NT]

Так. Скачал файл. Ууу...
Вы хоть немного головой соображайте. Вам дали шаблон кода. Не надо было его прямо в таком виде вставлять.

alt="!" width="!" height="!"
воскльцательные знаки — всего лишь заглушка. «!» в alt заменяется на текст, который будет показываться, если картинка не загрузилась: alt="Ололо" (либо пустая строка: alt="")
«!» в width и в height соответственно заменяются на ширину и высоту картинки.

Далее: все конструкции типа

Код: Выделить всё

document.write('<img src="big_header.pic" alt="!" width="!" height="!" 
/>');

должны быть в одну строку. В данном конкретном примере вот это:

Код: Выделить всё

/>');

надо присоединить к предыдущей строке.

Ну и, соответственно, «small_header.pic» и «big_header.pic» заменить на путям к вашим картинкам.

[Mondeo]

Палыч, там открытие тега есть, это он вместо хеадера выдаёт.
Oleg NT я сокращённо так называю

[Oleg NT]

Открыл я сейчас приложенный файл:

Код: Выделить всё

script type="text/javascript">

Где угловая скобка первая? Без нее это не тег. Соответственно, глюки всякие.

Oleg NT я сокращённо так называю

Что вы сокращенно называете? Не понял.
Я открыл файл, который вы приложили. Подозреваю, что ОН ЖЕ находится у вас на сервере. А в нем куча глюков.

Исправьте те замечания, которые написал я и Поручик. Потом будем дальше разговаривать.