2 части «обоев» CSS, которые изменяются в размере для браузера

Мой дизайнер считает, что это невозможно, однако мне это кажется возможным. (Хотя у меня ограниченный опыт CSS). Тем не менее, он также сказал, что фон не может быть исправлен, и stackoverflow доказал свою неправоту в прошлом; поэтому я подвергаю сомнению его знания.

JQuery можно использовать, если это не может быть сделано в чистом CSS. Однако это кажется возможным для меня. (Хотя у меня ограниченный опыт CSS). Тем не менее, он также сказал, что фон не может быть исправлен, и stackoverflow доказал свою неправоту в прошлом; поэтому я подвергаю сомнению его знания.

JQuery можно использовать, если это не может быть сделано в чистом CSS. Однако это кажется возможным для меня. (Хотя у меня ограниченный опыт CSS). Тем не менее, он также сказал, что фон не может быть исправлен, и stackoverflow доказал свою неправоту в прошлом; поэтому я подвергаю сомнению его знания.

JQuery можно использовать, если это не может быть сделано в чистом CSS.

Верхняя половина будет иметь градиент, который будет полностью гибким, чтобы наклоняться влево, вправо, вверх, вниз без особых искажений. Нижняя половина - это изображение, которое идеально сделано для разрешения 1280 x 1024 (так как это самое популярное разрешение экрана браузера). Затем, в зависимости от необходимых требований, он будет делать наброски и наклоняться до нужного размера. Все еще позволяет видеть все изображение.

Соотношение между верхней и нижней половинами всегда составляет 50%, 50% независимо от разрешения браузера.

Мне также хотелось бы, чтобы верхняя и нижняя части были зафиксированы.

В идеальном мире (без IE), я хотел бы сделать это с градиентами css3 и несколькими фонами в 1 DIV. Однако, поскольку IE9 еще не выпущен, я думаю, что лучший способ приблизиться к нему - это 2 деления в контейнере DIV и использование повторяющегося фона PNG для верхнего деления.

Следует отметить, что я собираюсь использовать css3pie.com, чтобы разрешить CSS3 для IE6-8 (но я не хочу на это полагаться, если не доказано на 100%)

Возможно ли это только с помощью CSS? Как бы вы это сделали?

Если это невозможно с помощью только CSS, могу ли я получить JavaScript / JQuery для помощи? Я думаю, что база 1280 x 1024 - не лучшая идея, потому что у нее странное радио.

Редактировать 1

О да, у меня тоже есть WIP: http://meyers.ipalaces.org/extra/

Выглядит хорошо в 1280 x 1024 ... теперь он просто получает полное изменение размера верхнего DIV, равное 50%, поэтому изображение составляет 50%.

Я все еще хотел бы, чтобы ВСЕ воды было видно, потому что мне нравится вид камней внизу. Тем не менее, я открыт для альтернативных идей, которые не достигают того, чего я хочу на 100%, но приближаются.

Редактировать 2

Как насчет использования верхнего градиента в качестве истинного фона CSS2, а затем просто поставить внизу, чтобы изменить размер? Возможно, это позволит использовать CSS2. Я ссылаюсь на некоторые приемы обхода здесь: Отдельный список

Редактировать 3

Я все еще ищу результаты, которые работают на IE6 и также не вызывают отставание Internet Explorer. Я устанавливаю награду в 50, чтобы привлечь больше внимания.