How to make a delay when moving a floating block?

Question

css

I need the effect, as if when scrolling, the block follows with a delay and when the scrolling stops, it gently takes the desired position. The block is initially located at the bottom of the window

div#footer_main {
  position: absolute;
  left: 50%;
  margin-left: -618.5px;
  margin-top: 535px;
}

$(document).ready(function () {
  let y_pos = $("#footer_main").offset().top;
  $(window).scroll(function () {
    if (y_pos - 535 < $(window).scrollTop()) {
      $("#footer_main").css({
        marginTop: += $(window).scrollTop();
        transition-delay: "0.2";
        transition-duration: "0.4";
      });
    };
  });
});

Answer 1

Use the transition-timing-function transition-timing-function -- htmlbook.ru/css/transition-timing-function A site where you can set up the "temporary function" yourself -- https://cubic-bezier.com/#.17, .67, .83, .67
transition-timing-function: ease;