用戶滾動時在屏幕上粘貼div

Question

當用戶滾動時，我想讓我的div right地粘在屏幕上。 這是一個示例情況： https ： //jsfiddle.net/gwjehuzf/

我嘗試了很多，但沒有成功。 像這樣的東西：

$(window).scroll(function () {

    if ($(document).scrollTop() > 400) {
        console.log("a");
        var newPos = $(document).scrollTop() + 400;
        $('.right').css({ top: newPos });
    }

    else {
        $('.right').css({ top: 400 });
    }
})

由於某種原因不起作用。 有任何想法嗎？

Answer 1

只需使用css .right {position：sticky; 頂部：0; 溢出：隱藏;}

Answer 2

只需添加幾個CSS ，我們就可以解決您的問題。 謝謝

.right {
  position: fixed;
  right: 0;
  width: calc(100% - 200px);
}

Answer 3

在您的代碼中添加此css

 .right { position: sticky; top: 5px; } 

Answer 4

不需要JavaScript。 使用position: fixed為.right div。
如果它消失了，給它一個寬度（可能大約80％）和right: 0 ：

.right {
    position: fixed;
    width: 80%;
    right: 0;
}

Answer 5

您可以通過添加position: sticky to .right並設置top: 0來實現此.right 。

.right {
  position: fixed;
  top: 0;
}

你的JSFiddle 在這里糾正了 。