Как убрать класс у кнопки при скролле до нее и добавить обратно, если прокрутить страницу обратно вверх на jquery?

Question

[righto]

Есть кнопка внизу страницы с классом fixed. Нужно при скролле до нее убрать этот класс, а если проскроллить страницу обратно вверх, класс опять должен добавляться.

Получается только убирать класс:

var $element = $('.checkout-bottom__button');

    $(window).scroll(function() {
	var scroll = $(window).scrollTop() + $(window).height();
	var offset = $element.offset().top;
				 
	if (scroll > offset) {
		$('.checkout-bottom__button').removeClass("fixed");
	}
    });

Если добавить else, то класс добавляется и убирается не так, как нужно, кнопка скачет туда сюда:

var $element = $('.checkout-bottom__button');

    $(window).scroll(function() {
	var scroll = $(window).scrollTop() + $(window).height();
	var offset = $element.offset().top;
				 
	if (scroll > offset) {
		$('.checkout-bottom__button').removeClass("fixed");
	} else {
		$('.checkout-bottom__button').addClass("fixed");
	}
    });

jsfiddle

Высота страницы непостоянна из за спрятанных, раздвигающихся при клике, блоков.

Answer 1

[Юпитер Макс]

высоту надо указывать, чтобы скрипт знал, когда добавлять или убирать класс

$("#back-top").hide();

		$(window).scroll(function (){
			if ($(this).scrollTop() > 700){
				$("#back-top").fadeIn();
			} else{
				$("#back-top").fadeOut();
			}
		});

		$("#back-top a").click(function (){
			$("body,html").animate({
				scrollTop:0
			}, 800);
			return false;
		});

Comments

[righto]

Высоту указать не получится, так как на странице есть спрятанные блоки, при клике на ссылки они раздвигаются, высота страницы непостоянна

[Lord_Dantes]

righto, значит вам нужно при скролле вычислять высоту страницы

[ProjectSoft]

righto,

то класс добавляется и убирается не так, как нужно, кнопка скачет туда сюда:

Сделайте код в песочнице, чтобы было понятно ваше "туда сюда"
Скорее всего дело в вашей реализации стилей для данного узла.

[righto]

ProjectSoft, добавил jsfiddle

[ProjectSoft]

righto,

[righto]

ProjectSoft, Спасибо!

[righto]

ProjectSoft, а почему нужно было вводить дополнительный элемент, в чем ошибка?

[ProjectSoft]

righto, всё очень просто.
По кнопке вы определяете её визуальную позицию на экране.
Когда вы её зафиксировали - изменилось ли позиция offset().top ?
Что нужно сделать? Правильно. Завести родителя с position не fixed. И именно по нему определять offset().top