как изменить фон элемента в зависимости от позиции в браузере

Question

В прошлом я видел несколько действительно красивых одностраничных веб-сайтов, где при прокрутке страницы появляются определенные элементы. Из того, что я помню, эффект, казалось, был написан только с использованием css. Я полагаю, что это возможно с помощью свойства z-index и position?

К сожалению, я не могу найти страницы снова.

У кого-нибудь есть рабочий пример?

Приветствие Christian

Answer 1

Это достигается с помощью z-index, как вы сказали, но другой ключ имеет элемент ниже, чтобы иметь position:fixed, например так:

#blocker { position:relative; z-index:100; width:100%; height:100px; }
#uncover { position:fixed; right:0; top:0; z-index:50; }

Затем, когда вы прокрутите страницу вниз,#uncover будет показано, поскольку оно останется в том же отношении к окну браузера, независимо от того, где вы прокручиваете, но #blocker прокручивается вверх по странице.Я создал пример скрипки здесь .