Масштабирование и центрирование содержимого окна под разрешение клиента

[son6ka]

Здравствуйте.

Есть макет. Ширина 1920px. На странице несколько больших фоновых изображений(на всю ширину макета). Область с контентом имеет фиксированную ширину в 960px и отцентрирована(margin: 0 auto). На разрешениях меньше 1920 естественно во-первых, получаем горизонтальную полосу прокрутки, во-вторых, после загрузки страницы ползунок уже сдвинут влево, т.е. пользователь видит сразу левую часть страницы.

Как отцентрировать макет даже для малых разрешений, просто обрезая ту часть макета, которая выходит за границы разрешения и не показывая полосу прокрутки, чтобы, например, при масштабировании пользователь смог увидеть и остальное?

Может у кого есть под рукой ссылки на подобную верстку - буду очень признательна.

Заранее благодарю за любую помощь.

Edited May 7, 2013 by son6ka

[red4pony]

div{
background: url(my_bg.jpg) center top no-repeat;

[son6ka]

Да, спасибо, я уже этот вариант пробовала. Для фоновых изображений - все ок. Но вот там еще есть слайдер с фото на всю ширину макета...

[red4pony]

Нужно посмотреть код. Выложите на http://jsfiddle.net/ или дайте ссылку на Ваш сайт.

[sitemaker999]

ставишь на body:

overflow-x: hidden;

Javascript:

scrollTo(document.documentElement.offsetWidth/4)
window.onresize = function() {
    scrollTo(document.documentElement.offsetWidth/4)
}

[son6ka]

sitemaker99,

спасибо вам огромное. То, что нужно.

Edited May 7, 2013 by son6ka

[Switch74]

странный костыль

я бы избавился от js через CSS:

блоку с фоном

position:absolute;left:50%;margin-left:-960px;

а родителю блока с фоном

position:relative;overflow:hidden;

но возможно кого-то устроит и вариант с js