Полуфиксированный элемент CSS? - PullRequest
3 голосов
/ 17 марта 2010

Я помню, как видел пример этого недавно, но для жизни я не могу найти сайт.

Это была кнопка или что-то подобное, которая находилась на своем месте в верхней части экрана, а затем, когда вы прокручивали ее, она оставалась на экране.

Теперь, когда я думаю об этом, он должен был работать на JavaScript, но выглядел действительно естественно.

Кто-нибудь знает сайт с такой функциональностью или информацию о том, как это сделать?

EDIT
Нет, это был не просто position:fixed или постоянно плавающий с использованием JavaScript.

1 Ответ

2 голосов
/ 18 марта 2010

Спасибо durilai за то, что он указал, что это было покрыто: Как сделать слайд элемента с областью просмотра при прокрутке?

Как оказалось, именно здесь, на SO (страница редактирования вопроса), я это видел. Поле «Как отформатировать» находится справа от поля редактирования и перемещается вместе с остальной частью страницы, но становится position:fixed, когда его следует прокручивать вне поля зрения.

Это делается с помощью jQuery. Я думаю, что у них есть некоторый пользовательский код, но вот моя реализация:

var scrollerTopMargin = $("#scroll-container").offset().top;
$(window).scroll(function(){
    var c = $(window).scrollTop();
    var d = $("#scroll-container");
    if (c > scrollerTopMargin) {
        d.css({ position: "fixed", top: "0px"   });
    }
    else if (c <= scrollerTopMargin) 
    {
        d.css({ position: "relative", top: ""   });
    }
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...