Javascript-форум - Прокрутка только картинки фона страницы

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Прокрутка только картинки фона страницы (https://javascript.ru/forum/misc/59351-prokrutka-tolko-kartinki-fona-stranicy.html)

Прокрутка только картинки фона страницы

Добрый день!

Задача такова: необходима прокрутка картинки фона, без прокрутки содержимого.

Картинка фона вертикальная. С горизонтальным монитором видна только верхняя ее треть. Необходимо скроллить фон (при том, что все содержимое остается на своих местах и нет полосы прокрутки).

Фон задан параметром: style="background-repeat:no-repeat; background-position: top center; background-size:cover".

Для наглядности: http://shmhsn.ru/

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

в вашем примере это достигается за счёт того, что в одном html файле написано:

<body background="images/4gW-auT8RZg.jpg" Link="#000000" VLink="#000000" ALink="#000000" style="background-repeat:no-repeat;background-position:center bottom; background-size:cover">

в другом:

<body background="images/4gW-auT8RZg.jpg" Link="#000000" VLink="#000000" ALink="#000000" style="background-repeat:no-repeat;background-position:center; background-size:cover">

а в третьем:

<body background="images/4gW-auT8RZg.jpg" Link="#000000" VLink="#000000" ALink="#000000" style="background-repeat:no-repeat;background-position: top center; background-size:cover">

Fkercaj,
вычислить разницу размеров окна и картинки и менять background-position в пределах этой величины по событию mousewheel

Цитата:

Сообщение от EmperioAf (Сообщение 394954)

в вашем примере это достигается за счёт того, что в одном html файле написано:

<body background="images/4gW-auT8RZg.jpg" Link="#000000" VLink="#000000" ALink="#000000" style="background-repeat:no-repeat;background-position:center bottom; background-size:cover">

в другом:

<body background="images/4gW-auT8RZg.jpg" Link="#000000" VLink="#000000" ALink="#000000" style="background-repeat:no-repeat;background-position:center; background-size:cover">

а в третьем:

<body background="images/4gW-auT8RZg.jpg" Link="#000000" VLink="#000000" ALink="#000000" style="background-repeat:no-repeat;background-position: top center; background-size:cover">

да, я сделал это специально. На каждой странице задана определенная область фона, но теперь каждую из них нужно заставить двигаться при скролле.